Divyesh
Divyesh

Reputation: 2413

.Net MAUI - Shell Navigation Back Button Title (iOS)

I have noticed one issue in Shell Navigation title. When setting ContentPage's Title property it shows same text with Back button also. Used NavigationPage.BackButtonTitle property as well from xaml still its not working.

For Example:

HomePage.xaml

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="Switch_Bug.HomePage"
             NavigationPage.BackButtonTitle="Back"
             Title="Home Page">
    <VerticalStackLayout>
        <Label 
            Text="Welcome to .NET MAUI!"
            VerticalOptions="Center" 
            HorizontalOptions="Center" />
    </VerticalStackLayout>
</ContentPage>


Result:

enter image description here

Expected result:

In iOS, it should Back Button text as "Back" otherwise just show the back button. But it shows the page's title text.

Update 02/02/2023

Upvotes: 2

Views: 4726

Answers (2)

Zack
Zack

Reputation: 1609

NavigationPage.BackButtonTitle is applicable to Navigation.PushAsync in NavigationPage, but not in Shell. There is a corresponding method in Shell’s navigation to change the text of the back button. I did a simple test, and you can modify your code as follows:

    <ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="Switch_Bug.HomePage"
             Title="Home Page">
    <VerticalStackLayout>
        <Label 
            Text="Welcome to .NET MAUI!"
            VerticalOptions="Center" 
            HorizontalOptions="Center" />
    </VerticalStackLayout>
    
    <Shell.BackButtonBehavior>
        <BackButtonBehavior TextOverride="Back" />   
    </Shell.BackButtonBehavior>
</ContentPage>

For more details, you can refer to the official documentation:.NET MAUI Shell navigation

Upvotes: 4

DevenCC
DevenCC

Reputation: 496

  • First of all, I believe BackButtonTitle will only work for iOS since Android does not use "back titles"
  • Second, the BackButtonTitle might be slightly counterintuitive, but it is the title that will be displayed on a further page that navigates back to the page you defined in on. In your case, setting the BackButtonTitle on your HomePage to "back" does not set the back button on the HomePage to "back"; it will set the back button to "back" on any page that has a back navigation to the HomePage. Hope that makes sense.

Upvotes: 0

Related Questions