Share via

Span gesture recognizer is not working for label with formatted string

Keerthana Krishna 60 Reputation points
2026-04-21T07:29:57.9+00:00

In .net maui 20, we are trying to use span gesture recognizer for label so I can append normal text with hyperlink. When clicking on hyperlink it should navigate to that link but it's not working in this way. I am pasting the code for reference.

<Label x:Name="MessageThreeLabel" LineBreakMode="WordWrap">

                    <Label.FormattedText>

<FormattedString>

<Span Text="Normal text"/>

<Span Text="Click Here" TextColor="Blue" TextDecorations="Underline">

<Span.GestureRecognizers>

<TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped" NumberOfTapsRequired="1"/>

</Span.GestureRecognizers>

</Span>

</FormattedString>

</Label.FormattedText>

</Label>

private async void TapGestureRecognizer_Tapped(object sender, TappedEventArgs e)

{

var url = "example url";

if(await Launcher.CanOpenAsync(url))

    {

await Launcher.OpenAsync(url);

    }

}  

its not working in this way, please suggest some solution or work around for this.

Developer technologies | .NET | .NET MAUI
0 comments No comments

4 answers

Sort by: Most helpful
  1. Varsha Dundigalla(INFOSYS LIMITED) 4,945 Reputation points Microsoft External Staff
    2026-04-21T12:15:46.6133333+00:00

    Thank you for reaching out.

    The code you shared is correct and this approach is supported in .NET MAUI. The issue you are seeing is not because of your implementation.

    This is a known issue on iOS where TapGestureRecognizer on a Span (inside Label.FormattedText) may not trigger properly. Because of this, even if the event or Command is written correctly, the tap itself is not detected, so nothing happens.

    This issue has already been reported and fixed in newer MAUI versions. Updating to the latest .NET/MAUI version and updating the MAUI Controls packages should resolve the problem in most cases.

    If you are still seeing the issue even after updating, it is due to current limitations on iOS with Span gesture handling.

    As a workaround, you can:

    • Use a separate Label or Button for the clickable text instead of Span
    • Or apply the TapGestureRecognizer on the whole Label and handle the navigation manually

    This should help you achieve the hyperlink behavior reliably.

    Reference:

    Please let us know if you require any further assistance, we’re happy to help. If you found this information useful, kindly mark this as "Accept Answer". So that others in the community facing similar issues can easily find the solution. Your contribution is highly appreciated.


  2. Keerthana Krishna 60 Reputation points
    2026-04-21T07:42:23.9933333+00:00

    I tried in the same way but it is not clickable. I tried implementing in view model and in the code behind as mentioned above but still it did not work. I am trying in iphone 11 and the version is 26.4.1.

    0 comments No comments

  3. Keerthana Krishna 60 Reputation points
    2026-04-21T07:41:10.18+00:00

    I tried in the same but it is not clickable. I tried implementing in view model and in the code behind as mentioned above but still it did not work. I am trying in iphone 11 and the version is 26.4.1.

    0 comments No comments

  4. Q&A Assist
    2026-04-21T07:30:11.9266667+00:00
    AI generated content. This question contains an answer created with AI from Q&A Assist. Learn more

    Span supports gesture recognizers, and the approach of adding a TapGestureRecognizer directly to the Span.GestureRecognizers collection is valid in .NET MAUI. The issue is likely not with the event handler itself but with how the hyperlink behavior is wired or with platform limitations.

    A reliable pattern is to use a TapGestureRecognizer with a Command and CommandParameter (the URL) and then open the URL via Launcher.OpenAsync. This is the pattern used in the official hyperlink guidance and works both for Label and Span.

    Example using a TapGestureRecognizer with Command on a Span:

    <Label LineBreakMode="WordWrap">
        <Label.FormattedText>
            <FormattedString>
                <Span Text="Normal text" />
                <Span Text=" Click Here"
                      TextColor="Blue"
                      TextDecorations="Underline">
                    <Span.GestureRecognizers>
                        <TapGestureRecognizer
                            Command="{Binding TapCommand}"
                            CommandParameter="https://example.com" />
                    </Span.GestureRecognizers>
                </Span>
            </FormattedString>
        </Label.FormattedText>
    </Label>
    

    Code-behind (or ViewModel) implementing the command:

    using System.Windows.Input;
    using Microsoft.Maui.ApplicationModel; // for Launcher
    
    public partial class MainPage : ContentPage
    {
        public ICommand TapCommand => new Command<string>(async (url) =>
        {
            if (await Launcher.CanOpenAsync(url))
                await Launcher.OpenAsync(url);
        });
    
        public MainPage()
        {
            InitializeComponent();
            BindingContext = this;
        }
    }
    

    Key points:

    1. Span can host gesture recognizers via its GestureRecognizers collection; this is supported and documented.
    2. Using Command/CommandParameter with TapGestureRecognizer is the recommended pattern for hyperlink-like behavior.
    3. Ensure the BindingContext is set so that the TapCommand binding resolves.

    If keeping the code-behind event handler is required instead of a command, ensure the Tapped event is actually wired (no typos, correct namespace, and the handler signature matches). However, the command-based approach above aligns with the documented hyperlink implementation and avoids most wiring issues.

    For more reusable hyperlinks, a custom HyperlinkSpan class can be created that sets the blue/underline styling and attaches a TapGestureRecognizer which calls Launcher.OpenAsync with a bindable Url property.


    References:

Your answer

Answers can be marked as 'Accepted' by the question author and 'Recommended' by moderators, which helps users know the answer solved the author's problem.