c# - Label Xamarin.Forms 中的可点击 HTML 超链接

Question

我正在尝试使 xaml 标签中的 HTML 超链接可点击。我创建了类，这些类从 API 中获取包含 HTML 的字符串，并在 Android 和 iOS 中的自定义标签渲染器中将其正确渲染为 HTML。为了更好地理解我的困境，有必要解释一下我的使用范围。

在我的应用程序中，我有一个消息组件，它只是使用 API 来发布和从网站获取对话，该网站主要用于更好地帮助我们的用户，因为我们的办公室因冠状病毒而关闭。网站上的消息中心允许复杂的文本格式，如网络论坛帖子可能，如粗体、斜体、超链接等。

为了在移动设备上正确显示它，我必须创建一个自定义标签渲染器，它将使用带有 HTML 标签的字符串并将其正确显示为消息正文。这是一个足够简单的任务。

问题是消息有时可能有超链接，当前显示为正确的链接，但是当用户尝试单击链接时，列表项是注册点击的内容，而不是标签，也不是标签中的 html 链接。

预期的结果是，当用户单击列表中标签内的超链接时，它将在设备默认浏览器中打开该超链接。

我知道一种解决方案可能是解析任何链接的消息正文，创建一个链接列表，然后将跨度动态添加到每个都有自己的手势识别器的标签中，但这对我来说是不可能的到有时在对话中途的超链接。消息正文的示例可能是:

'您好 用户 ，请转至this link登录到您的帐户。

我知道有比这更好的方法来创建消息传递应用程序，但移动端的主要目的是让用户更容易地访问员工的回复，以及对员工消息的简单聊天回复。工作人员将专门使用该站点来回应用户，并可能利用复杂的编辑器更好地帮助用户。

谢谢你。
编辑:


在上面的例子中，最后的链接是不可点击的。当我单击链接时，整个 ListView 项都会突出显示，就好像该 ui 元素的优先级高于其中的标签一样。

相关代码:

<ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <Frame
                        Margin="5"
                        Padding="0"
                        BorderColor="LightGray"
                        CornerRadius="15"
                        HasShadow="False">
                        <StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
                            <StackLayout
                                Padding="5"
                                BackgroundColor="#f5f5f5"
                                Orientation="Horizontal">
                                <Label
                                    Margin="5,2.5,5,2.5"
                                    BackgroundColor="Transparent"
                                    FontAttributes="Bold"
                                    FontSize="Small"
                                    HorizontalOptions="FillAndExpand"
                                    HorizontalTextAlignment="Start"
                                    Text="{Binding SentBy}"
                                    TextColor="Black"
                                    VerticalOptions="FillAndExpand" />
                                <Label
                                    Margin="5,2.5,5,2.5"
                                    BackgroundColor="Transparent"
                                    FontAttributes="Bold"
                                    FontSize="Small"
                                    HorizontalOptions="FillAndExpand"
                                    HorizontalTextAlignment="End"
                                    Text="{Binding Sent}"
                                    TextColor="Black"
                                    VerticalOptions="FillAndExpand" />
                            </StackLayout>
                            <StackLayout Padding="5" Orientation="Horizontal">
                                <Label
                                    Margin="2.5"
                                    BackgroundColor="Transparent"
                                    FontSize="Small"
                                    HorizontalOptions="FillAndExpand"
                                    HorizontalTextAlignment="Start"
                                    Text="{Binding Body}"
                                    TextColor="Black"
                                    TextType="Html"
                                    VerticalOptions="FillAndExpand" />
                            </StackLayout>
                        </StackLayout>
                    </Frame>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>

Answer 1

重新发布/编辑我之前的答案，因为它因不完整而被删除。

这应该有一些帮助:

Showing part of a label as a clickable link, has been a long desired feature of Xamarin.Forms. With the release of 3.2.0, this is now possible.

可点击跨度

创建一个带有 FormattedText 属性和跨度的标签，如下所示。对于那些不熟悉的人，标签有一个名为 FormattedText 的属性。它允许您将文本拆分为单独的部分，因此您可以对每个部分进行不同的格式设置。

<Label HorizontalOptions="Center"
       VerticalOptions="CenterAndExpand">
    <Label.FormattedText>
        <FormattedString>
            <Span Text="Hello " />
            <Span Text="Click Me!"
                  TextColor="Blue"
                  TextDecorations="Underline">
                <Span.GestureRecognizers>
                    <TapGestureRecognizer Command="{Binding ClickCommand}"
                                          CommandParameter="https://xamarin.com" />
                </Span.GestureRecognizers>
            </Span>
            <Span Text=" Some more text." />
        </FormattedString>
    </Label.FormattedText>
</Label>

在您的 ViewModel 中，添加以下命令。

public ICommand ClickCommand => new Command<string>((url) =>
{
    Device.OpenUri(new System.Uri(url));
});

这将产生一个带有 Click Me! 的标签。文本突出显示。点击文本，将打开浏览器并转到 xamarin.com。

引用: https://xamarinhelp.com/hyperlink-in-xamarin-forms-label/