web-dev-qa-db-ja.com

Xamarin.Forms(xamlおよびc#)を使用してハイパーリンクを作成する

私は比較的経験の浅いプロのプログラマーです(20歳です)。したがって、まだ完全には把握していない大きな概念があるかもしれないので、事前に謝罪します。 1時間のグーグル検索では役に立たなかったため、これが適切な質問であることを願っています。

基本的に、ラベルクラスを使用してXamarin.Formsにハイパーリンクを作成します。基本的に、私はユーザーをウェブブラウザでgoogle.comに連れて行くためにリンクをたどりたいです:

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

Xamarin Forms APIでこれについて何も見つけることができず、インターネットではXamarin.Formsのこのトピックに関するあいまいで限定的な情報しかありません。

これは可能ですか?もしそうなら、誰かが私を正しい方向に向けてください。答えてくれたすべての人に事前に感謝します。

18
jnel899

ラベルはデフォルトではユーザー入力に応答しないため、これを実際に行うことはできませんが、ジェスチャーで同様のことを実現できます

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);
20
Jason

この小さなクラスを作成して処理しました。

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)) });
    }
}

また、下線を引きたい場合はもう少し複雑です。

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; } }
}

この投稿に触発された後者のクラス: xamarinフォームで下線を引く方法


編集:XLabsには HyperLinkLabel もあります。

10
noelicus

ボタンとxamarin.forms.theme nugetを使用します

<Button StyleClass = "Link"/>

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

5
Ahmed.Net

Xamlでこれを行いたい場合は、青いテキスト色のラベルとGestureRecognizersを作成してコマンドに接続できます。

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

ViewModelで、Xamarin Essentials Nugetパッケージを使用してデフォルトのブラウザーを起動できます。

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);
    }

});
1
Donal