Html clickable link in Label

ArthurMaury

Hello,
I would like to put some html content inside a Label (or something else if needed).
I managed to do a Custom renderer so that the html is displayed in the Label.
On Android there is no problem with making the links clickable, but on iOS the UILabel doesn't have the "shouldInteractWithURL" attribute, only UITextView has it.
Is there a way to make the html links clickable on both iOS and Android?

Thank you.

ArthurMaury

I found a solution, if someone needs it, here is the code of the custom renderer for iOS:

class HtmlLabelRenderer : ViewRenderer<Label, UITextView>
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
        {
            base.OnElementChanged(e);

            var view = (HtmlLabel)Element;
            if (view == null) return;

            UITextView textView = new UITextView(new CGRect(0, 0, view.Width, view.Height));
            textView.Text = view.Text;
            textView.Font = UIFont.SystemFontOfSize((float)view.FontSize);
            textView.Editable = false;
            textView.Bounces = false;

            // Setting the data detector types mask to capture all types of link-able data
            textView.DataDetectorTypes = UIDataDetectorType.All;
            textView.BackgroundColor = UIColor.Clear;

            // overriding Xamarin Forms Label and replace with our native control
            SetNativeControl(textView);
        }
}

fshanssen

@ArthurMaury said:
// overriding Xamarin Forms Label and replace with our native control
SetNativeControl(textView);

Hi! I tried this solution, but I get an error saying: "Cannot convert from 'UIKit.UITextView' to 'UIKit.UILabel'". You didn't have a problem with that?

Thanks!

ArthurMaury

Hi,
Did you copy/paste the whole code? The inherited class is ViewRenderer<Label, UITextView> which shouldn't cause any error with UILabel.

fshanssen

Aha, that did the trick thank you for a quick reply!

fshanssen

Hi again! Before I tried your solution for clickable links, I could convert the html to rich text, but the links were not clickable. Now, the links are clickable, but the html tags show. Does it show rich text in your solution? Thanks!

ArthurMaury

Hi,
I'm sorry I still have access to the code but I can't test it, I think that this piece of code in the custom renderer should do the trick:

protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        base.OnElementPropertyChanged(sender, e);

        var view = (HtmlLabel)Element;
        if (view == null) return;

        UITextView textView;

        if (Control == null)
        {
            textView = new UITextView();
            SetNativeControl(textView);
        }
        else if (e.PropertyName == Label.TextProperty.PropertyName)
        {
            if (Element != null && !string.IsNullOrWhiteSpace(Element.Text))
            {
                var attr = new NSAttributedStringDocumentAttributes();
                var nsError = new NSError();
                attr.DocumentType = NSDocumentType.HTML;

                var myHtmlData = NSData.FromString(view.Text, NSStringEncoding.Unicode);
                Control.AttributedText = new NSAttributedString(myHtmlData, attr, ref nsError);
            }
        }

    }

fshanssen

Thank you, that fixed my problem!