Using Visual Studio Community edition 2022.
New to .Net MAUI and am trying to follow the examples provided in the documentation found at https://docs.microsoft.com/en-us/dotnet/maui/user-interface/controls/label
The XAML code below (from the docs) is used to create a "link" using a tap recognizer:
<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>
However, the command (OpenUrlCommand) is never called - tested using the Windows and Andriod emulators.
In my ViewModel, I define the OpenUrlCommand as follows:
public ICommand OpenUrlCommand => new Command<string>( async ( url ) => await Launcher.OpenAsync( url ) );
... but nothing works, I also tried the following -- no go ...
public ICommand OpenUrlCommand => new Command<string>( async ( url ) => await Browser.OpenAsync( url ) );
... and then tried the following -- again, no luck ...
public IRelayCommand OpenUrlCommand => new RelayCommand<string>( async ( url ) => await Launcher.OpenAsync( url ) );
I then replaced the call to open the url with a Debug.WriteLine( url ), and it seems that the OpenUrlCommand is never being called. Also, one would expect the cursor to change when hovering over the "link" text, but it never does -- it is as though the TapGesterRecognizer is not being created or registered.
As a last ditch effort, I also tried the following (again, copying from the docs):
<Label TextType="Html">
<![CDATA[
This is <a href="https://docs.microsoft.com/dotnet/maui/" target="_blank">a link to another site</a>.
]]>
</Label>
... no luck -- the link appears underlined, but when clicked on, nothing happens (cursor does not change, browser does not open).
Any advice, or even better, a working example would be appreciated.
UPDATE: Found this post as well: https://github.com/dotnet/maui/issues/4734 - which looks like this was a known bug back in February!
As per @Jessie Zhang -MSFT, I ended up doing the following - which underlines the link, but with the caveat that the WHOLE label is tapable ...
<!--
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>
... and in my ViewModel:
public IRelayCommand OpenUrlCommand => new RelayCommand<String>( launch_browser );
private async void launch_browser( String url )
{
Debug.WriteLine( $"*** Tap: {url}" );
await Browser.OpenAsync( url );
}
... the above works (for me) in the Windows and Andriod simulators.
CodePudding user response:
Yes, it is a known issue about this problem.
You can follow it here: https://github.com/dotnet/maui/issues/4734 .
But as a workaround, you can use Label.GestureRecognizers
instead of Span.GestureRecognizers
.
For example:
<Label
Text="click here"
VerticalOptions="Center"
HorizontalOptions="Center" >
<Label.GestureRecognizers>
<TapGestureRecognizer Command="{Binding TapCommand}"
CommandParameter="https://docs.microsoft.com/dotnet/maui/" />
</Label.GestureRecognizers>
</Label>