.Net MAUI 如何在标签中包含链接

Question

使用 Visual Studio 社区版 2022。

.Net MAUI 新手，我正在尝试遵循https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/label上的文档中提供的示例

下面的 XAML 代码（来自文档）用于使用点击识别器创建“链接”：

     <Label>
        <Label.FormattedText>
           <FormattedString>
              <Span 
                 Text="Link: " 
              />
              <Span 
                 Text="click here to open the docs"
                 TextColor="Blue"
                 TextDecorations="Underline">
                 <Span.GestureRecognizers>
                    <TapGestureRecognizer
                       Command="{Binding OpenUrlCommand}"
                       CommandParameter="https://learn.microsoft.com/dotnet/maui/" 
                    />
                 </Span.GestureRecognizers>
              </Span>
           </FormattedString>
        </Label.FormattedText>
     </Label>

但是，该命令 (OpenUrlCommand) 从未被调用 - 使用 Windows 和 Andriod 模拟器进行测试。

在我的 ViewModel 中，我定义 OpenUrlCommand 如下：

public ICommand OpenUrlCommand => new Command<string>( async ( url ) => await Launcher.OpenAsync( url ) );

...但是没有任何效果，我也尝试了以下方法 - 不行...

public ICommand OpenUrlCommand => new Command<string>( async ( url ) => await Browser.OpenAsync( url ) );

...然后尝试了以下操作 - 再次，没有运气...

public IRelayCommand OpenUrlCommand => new RelayCommand<string>( async ( url ) => await Launcher.OpenAsync( url ) );

然后，我用 Debug.WriteLine( url ) 替换了打开 url 的调用，似乎 OpenUrlCommand 从未被调用。另外，当鼠标悬停在“链接”文本上时，人们会期望光标发生变化，但它永远不会发生变化——就好像 TapGesterRecognizer 没有被创建或注册一样。

作为最后的努力，我还尝试了以下操作（再次从文档中复制）：

<Label TextType="Html">
    <![CDATA[
       This is <a href="https://learn.microsoft.com/dotnet/maui/" target="_blank">a link to another site</a>.
    ]]>
 </Label>

...不走运 - 链接显示有下划线，但是单击时没有任何反应（光标没有改变，浏览器没有打开）。

任何建议，或者更好的是，一个可行的例子将不胜感激。

更新： 也找到了这篇文章： https: //github.com/dotnet/maui/issues/4734 - 看起来这是二月份的一个已知错误！

根据 @Jessie 张 -MSFT，我最终做了以下操作 - 强调了链接，但需要注意的是整个标签是可点击的......

     <!-- 
     
     This works - HOWEVER, the WHOLE label is tappable.  We cannot use
     Span.GestureRecognizers because of the following issue:
     
     https://github.com/dotnet/maui/issues/4734
     
     -->

     <Label>
        <Label.GestureRecognizers>
           <TapGestureRecognizer 
              Command="{Binding OpenUrlCommand}"
              CommandParameter="https://learn.microsoft.com/en-us/dotnet/maui/" 
           />
        </Label.GestureRecognizers>
        <Label.FormattedText>
           <FormattedString>
              <Span 
                 Text="To learn more, " 
              />
              <Span 
                 Text="check the documentation"
                 TextColor="Blue"
                 TextDecorations="Underline">
              </Span>
              <Span 
                 Text="." 
              />
           </FormattedString>
        </Label.FormattedText>
     </Label>

...在我的 ViewModel 中：

  public IRelayCommand OpenUrlCommand => new RelayCommand<String>( launch_browser );


  private async void launch_browser( String url )
  {

     Debug.WriteLine( $"*** Tap: {url}" );

     await Browser.OpenAsync( url );

  }

...以上工作（对我来说）在 Windows 和 Andriod 模拟器中。

Answer 1

是的，这是关于此问题的已知问题。

您可以在这里关注： https: //github.com/dotnet/maui/issues/4734。

Label.GestureRecognizers但作为解决方法，您可以使用Span.GestureRecognizers.

例如：

       <Label 
        Text="click here"
        VerticalOptions="Center" 
        HorizontalOptions="Center" >

        <Label.GestureRecognizers>
            <TapGestureRecognizer Command="{Binding TapCommand}"
                                      CommandParameter="https://learn.microsoft.com/dotnet/maui/" />
        </Label.GestureRecognizers>

    </Label>