.Net MAUI 如何在 Label 中包含鏈接

Question

使用 Visual Studio 社區版 2022。

.Net MAUI 的新手，我正在嘗試遵循https://docs.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://docs.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 ) );

...但是沒有任何效果，我還嘗試了以下方法-沒有 go ...

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。 此外，人們會期望 cursor 在將鼠標懸停在“鏈接”文本上時會發生變化，但它從來沒有發生過——就好像沒有創建或注冊 TapGesterRecognizer。

作為最后的努力，我還嘗試了以下方法（再次，從文檔中復制）：

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

... 不走運——該鏈接帶有下划線，但是當點擊時，什么也沒有發生（光標沒有改變，瀏覽器沒有打開）。

任何建議，甚至更好的工作示例將不勝感激。

更新：也找到了這篇文章： https://github.com/dotnet/maui/issues/4734 - 看起來這是二月份的一個已知錯誤！

根據@Jessie Zhang -MSFT，我最終做了以下事情 - 強調了鏈接，但需要注意的是整個 label 是可錄音的......

     <!-- 
     
     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://docs.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://docs.microsoft.com/dotnet/maui/" />
        </Label.GestureRecognizers>

    </Label>