• Home
  • Documentation
Show / Hide Table of Contents
  • Introduction
  • Commands
    • Commanding
    • Composite Commands
    • Async Commands
    • Error Handling
  • Dependency Injection
    • Getting Started
    • Registering Types
    • Microsoft Extensions (Supplement)
    • Platform Specific Services
    • Exception Handling
    • ContainerLocator
    • Appendix
  • Dialog Service
    • Dialog Service
    • IDialogAware ViewModels
    • IDialogWindow (WPF & Uno Platform)
  • Event Aggregator
  • Mvvm
    • BindableBase
    • ViewModelLocator
  • Modularity
    • Getting Started
    • Module Catalog
    • Module Initialization
  • Navigation
    • Getting Started
    • INavigationParameters
    • Page Navigation
    • Regions
      • Getting Started
      • Region Manager
      • Region Adapters
      • Region Behaviors
      • About Navigation in Prism
      • Basic Region Navigation
      • View/ViewModel Participation
      • Navigating to Existing Views
      • Passing Parameters
      • Confirming Navigation
      • Controlling View Lifetime
      • Navigation Journal
  • Platforms
    • Maui
      • Getting Started
      • Migrating from Prism.Forms
      • PrismAppBuilder
      • AppModel
        • IPageLifecycleAware
      • Behaviors
        • Introduction
        • BehaviorBase<T>
        • EventToCommandBehavior
        • PageBehaviorFactory
      • Dialogs
        • Getting Started
        • IPageDialogService
      • Navigation
        • Introduction
        • Page Navigation
        • NavigationBuilder
        • TabbedPages
        • Understanding the INavigationResult
        • NavigationExceptions
        • Global Navigation Observer
        • XAML Navigation
    • Uno Platform
      • Getting Started
      • Uno.Extensions
    • Wpf
      • Introduction
      • Getting Started
      • View Composition
      • Interactivity
        • Event To Command
    • Xamarin.Forms
      • Create Your First App
      • Behaviors
        • Working with Behaviors
        • EventToCommand Behavior
        • PageBehaviorFactory
      • Dialogs
        • Dialogs
        • Page Dialog Service
        • Dialog Service
        • Styling Dialogs
      • Navigation
        • Navigation Basics
        • Passing Parameters
        • Confirming Navigation
        • Deep Linking
        • Working w/ MasterDetailPages
        • Working w/ NavigationPages
        • Working w/ TabbedPages
        • XAML Navigation
      • Application Lifecycle
      • Page Lifecycle
      • Additional Platforms
        • GTK
  • Magician
    • Getting Started
  • Plugins
    • Essentials
      • Getting Started
      • ApplicationModel
        • App Context
        • Browser
        • Communication
          • Email
          • Phone Dialer
        • Data Transfer
          • Clipboard
          • Share
        • LatestVersion
        • Launcher
        • Version Tracking
      • Devices
        • Battery
        • Sensors
          • Biometrics
          • Geocoding
          • Geofencing
          • Geolocation
      • IO
        • File System
        • Stores
      • Media
        • Getting Started
        • Camera
        • Video
      • Networking
        • Connectivity
      • Notifications
        • Getting Started
        • ActionSheets
        • Alerts
        • Prompts
      • Permissions
        • Permissions Manager
      • Threading
        • Main Thread
    • Logging
      • Getting Started
      • Interop
        • Essentials
        • Microsoft Extensions
      • Providers
        • AppCenter
        • Console
        • Debug
        • Firebase
        • Graylog
        • Kochava
        • Raygun
        • Sentry
        • Unit Testing
        • Xunit
    • Observable Regions
    • Popups
  • Pipelines
    • Commercial Plus

XAML Navigation

XAML Navigation is a favorite feature for many Prism developers. This gives you the ability to reduce the amount of code you need to write in your ViewModel and focus on simplifying your code by simply enabling Navigation on an as needed basis.

Typical Navigation Setup

First we need to be sure we have a ViewModel like:

public class MainPageViewModel : BindableBase
{
    private readonly INavigationService _navigationService;

    public MainPageViewModel(INavigationService navigationService)
    {
        _navigationService = navigationService;
        NavigateCommand = new DelegateCommand(OnNavigateCommandExecuted);
    }

    public DelegateCommand<string> NavigateCommand { get; }

    private async void OnNavigateCommandExecuted(string uri)
    {
        await _navigationService.NavigateAsync(uri);
    }
}

Then of course we need to set up our View:

<FlyoutPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            x:Class="AwesomeApp.MainPage">
  <FlyoutPage.Flyout>
    <ContentPage Title="Menu">
      <VerticalStackLayout>
        <Button Text="View A"
                Command="{Binding NavigateCommand}"
                CommandParameter="NavigationPage/ViewA" />
        <Button Text="View B"
                Command="{Binding NavigateCommand}"
                CommandParameter="NavigationPage/ViewB" />
        <Button Text="View C"
                Command="{Binding NavigateCommand}"
                CommandParameter="NavigationPage/ViewC" />
      </VerticalStackLayout>
    </ContentPage>
  </FlyoutPage.Flyout>
</FlyoutPage>

Using XAML Navigation

When we use XAML Navigation we can get rid of 100% of the C# code that we had to write in the sample above, and we simply update the XAML for a significantly cleaner approach.

<FlyoutPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            xmlns:prism="http://prismlibrary.com"
            x:Class="AwesomeApp.MainPage">
  <FlyoutPage.Flyout>
    <ContentPage Title="Menu">
      <VerticalStackLayout>
        <Button Text="View A"
                Command="{prism:Navigate 'NavigationPage/ViewA'}" />
        <Button Text="View B"
                Command="{prism:Navigate 'NavigationPage/ViewB'}" />
        <Button Text="View C"
                Command="{prism:Navigate 'NavigationPage/ViewC'}" />
      </VerticalStackLayout>
    </ContentPage>
  </FlyoutPage.Flyout>
</FlyoutPage>
  • Edit on GitHub
  • Ask questions
  • Follow @PrismLib
  • Follow @BrianLagunas
  • Follow @DanJSiegel
Back to top Copyright 2015-2024 Prism Software, LLC