How do I create a navigation page in .NET MAUI?

Platform: .NET MAUI| Category: Pages

Create a content page named DetailsPage in the .NET MAUI project.
Change the following line the in App.xaml.cs file:

MainPage = new MainPage();

To

MainPage = new NavigationPage(new MainPage());

Add the Button control in the MainPage.xaml for navigation to the DetailsPage when clicking the button.

XAML

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             Title="MainPage"
             x:Class="NavigationDemo.MainPage">

    <VerticalStackLayout VerticalOptions="Center">
        <Button Text="Navigate to DetailsPage"
                Clicked="Button_Clicked" />
    </VerticalStackLayout>

</ContentPage>

Add the Button_Clicked method in the Main.xaml.cs file.

C#

private async void Button_Clicked(object sender, EventArgs e)
    {
        await Navigation.PushAsync(new DetailsPage());
    }

Share with

Related FAQs

Couldn't find the FAQs you're looking for?

Please submit your question and answer.