Create a hyperlink using Xamarin.Forms (xaml and c

2019-03-24 08:44发布

问题:

I am a relatively inexperienced professional programmer (I'm only 20 years old). Therefore, I apologize in advance as there may be some larger concepts that I do not fully grasp yet. I hope this is an appropriate question to ask, as an hour of googling could not help me.

I basically want to create a hyperlink in Xamarin.Forms using the label class. Basically, I want to following link to take the user to google.com in a web browser:

<Label Text="http://www.google.com/" />

I can't find anything in the Xamarin Forms API about this and the internet has vague and limited information on this topic in Xamarin.Forms.

Is this possible? If so, could someone please point me in the right direction? Thanks in advance to anyone who answers.

回答1:

You can't really do this because Labels by default don't respond to user input, but you can achieve something similar with gestures

Label label = new Label();
label.Text = "http://www.google.com/";

var tapGestureRecognizer = new TapGestureRecognizer();
tapGestureRecognizer.Tapped += (s, e) => {
    Device.OpenUri( new Uri((Label)s).Text);
};
label.GestureRecognizers.Add(tapGestureRecognizer);


回答2:

I made this little class to handle it:

public class SimpleLinkLabel : Label
{
    public SimpleLinkLabel(Uri uri, string labelText = null)
    {
        Text = labelText ?? uri.ToString();
        TextColor = Color.Blue;
        GestureRecognizers.Add(new TapGestureRecognizer { Command = new Command(() => Device.OpenUri(uri)) });
    }
}

And a bit more involved if you want to underline it too:

public class LinkLabel : StackLayout
{
    private SimpleLinkLabel label;

    public LinkLabel(Uri uri, string labelText = null, bool underlined = true)
    {
        // Remove bottom padding
        Padding = new Thickness(Padding.Left, Padding.Top, Padding.Right, 0);
        VerticalOptions = LayoutOptions.Center;

        Children.Add(label = new SimpleLinkLabel(uri, labelText));

        if (underlined)
            Children.Add(new BoxView { BackgroundColor = Color.Blue, HeightRequest = 1, Margin = new Thickness(0, -8, 0, 0) });
    }

    public TextAlignment HorizontalTextAlignment { get { return label.HorizontalTextAlignment; } set { label.HorizontalTextAlignment = value; } }
}

The latter class inspired by this post: how to underline in xamarin forms


Edit: XLabs have a HyperLinkLabel too.



回答3:

use a button and a xamarin.forms.theme nuget

<Button StyleClass = "Link"/>

https://developer.xamarin.com/guides/xamarin-forms/user-interface/themes/light/



回答4:

If you want to do this in Xaml, you can create a Label with a blue text colour and a GestureRecognizers to hook it up to a Command:

<Label TextColor="Blue" Text="{Binding Model.LinkDescription}">
    <Label.GestureRecognizers>
        <TapGestureRecognizer Command="{Binding ClickCommand}" CommandParameter="{Binding Model.LinkURL}"/>
    </Label.GestureRecognizers>
</Label>

In your ViewModel you can launch the default Browser using the Xamarin Essentials Nuget Package:

private Boolean IsValidUri(String uri)
{
    try
    {
        new Uri(uri);
        return true;
    }
    catch
    {
        return false;
    }
}

public ICommand ClickCommand => new Command<string>(async (url) =>
{
    try
    {
        if (!string.IsNullOrEmpty(url))
        {
            if (!url.Trim().StartsWith("http", StringComparison.OrdinalIgnoreCase))
            {
                url = "http://" + url;
            }
            if (IsValidUri(url))
            {
                await Browser.OpenAsync(new Uri(url), BrowserLaunchMode.SystemPreferred);
            }
        }
    }
    catch(Exception ex)
    {
        Debug.WriteLine(ex.Message);
    }

});