Request Navigate In PRISM

Prism is a framework for building loosely coupled, maintainable, and testable XAML applications in WPF, Windows 10 UWP, and Xamarin Forms.

 

RequestNavigate method was introduced in Prism 6.

 

In this tutorial, I am going to be creating a simple project to demonstrate how to use the prism RequestNavigate method to navigate between two views in a Region.

 

I assume you already have  knowledge of {rism and MVVM so go ahead and create a new WPF Application and name it PrismDemo.

 

Add reference of the Prism library to the application from Nuget package as shown below,

 

 

Delete the MainWindow.xaml and add a new Window called Shell.xaml.

 

The User interface of the Shell.xaml  will be very simple consisting of two buttons that will be used to navigate between views and a ContentControl that will serve as the region for the views and the region name is MainRegion.

<Window x:Class="PrismDemo.Shell"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:PrismDemo"
        mc:Ignorable="d"
        xmlns:prism ="http://prismlibrary.com/"
        Title="Shell" Height="300" Width="300">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="auto"/>
                <ColumnDefinition Width="auto"/>
            </Grid.ColumnDefinitions>
            <Button Width="75" Height="30" Command="{Binding ViewACommand}" Content="View A" Margin="20,20,20,0" Grid.Column="0"/>
            <Button Width="75" Height="30" Command="{Binding ViewBCommand}" Content="View B" Margin="20,20,20,0" Grid.Column="1"/>
        </Grid>
        <ContentControl Grid.Row="1" prism:RegionManager.RegionName="MainRegion"/>
    </Grid>
</Window>

 

It is now time for the Bootstrapper class.

 

Create a new class called the Bootstrapper.cs and paste the code below.

using Microsoft.Practices.Unity;
using Prism.Unity;
using System.Windows;

namespace PrismDemo
{
    public class Bootstrapper: UnityBootstrapper
    {
        protected override void InitializeShell()
        {
            base.InitializeShell();
            Application.Current.MainWindow.Show();
        }
        protected override DependencyObject CreateShell()
        {
            return Container.Resolve<Shell>();

        }

        protected override void ConfigureContainer()
        {
            base.ConfigureContainer();
            Container.RegisterTypeForNavigation<ViewA>("ViewA");
            Container.RegisterTypeForNavigation<ViewB>("ViewB");
        }
    }
}

From the code above, the views to be navigated to are registered in the ConfigureContainer method using the RegisterTypeForNavigation method which is an extension method in Prism.Unity.

 

 

Create another class called the ViewModel.cs which will be the viewmodel for the Shell.xaml, copy and paste the code below.

using Microsoft.Practices.ServiceLocation;
using Prism.Commands;
using Prism.Regions;

namespace PrismDemo
{
    public class ViewModel
    {
        public ViewModel()
        {
            ViewACommand = new DelegateCommand(ViewAAction);
            ViewBCommand = new DelegateCommand(ViewBAction);
        }


        private void ViewAAction()
        {
            RegionManger.RequestNavigate("MainRegion", "ViewA");
        }
        private void ViewBAction()
        {
            RegionManger.RequestNavigate("MainRegion", "ViewB");
        }

        public DelegateCommand ViewACommand { get; }
        public DelegateCommand ViewBCommand { get; }
        IRegionManager RegionManger { get { return ServiceLocator.Current.GetInstance<IRegionManager>(); } }
    }
}

The ViewModel.cs consist of the two DelegateCommand Property that we will bind to the buttons in the Shell.

 

When any button is clicked, the ViewAAction() or ViewBAction() method is executed.

 

The method calls the RequestNavigate method which in our case takes in two parameters which are the RegionName and the name of the View to navigate to.

 

Set the DataContent of the Shell to ViewModel.cs as shown below

using System.Windows;

namespace PrismDemo
{
    /// <summary>
    /// Interaction logic for Shell.xaml
    /// </summary>
    public partial class Shell : Window
    {
        public Shell()
        {
            InitializeComponent();
            DataContext = new ViewModel();
        }
    }
}

Lastly, go to the App.xaml and remove this line of code.

StartupUri="MainWindow.xaml"

And in the App.xaml.cs override the OnStartUp Method.

using System.Windows;

namespace PrismDemo
{
    /// <summary>
    /// Interaction logic for App.xaml
    /// </summary>
    public partial class App : Application
    {
        protected override void OnStartup(StartupEventArgs e)
        {
            new Bootstrapper().Run();
        }
    }
}

Now run the application and you see something like these: