Easy way of navigate using Prism in WPF

1.First.xaml

<UserControl x:Class="PrismMain.Views.First"

             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

             xmlns:local="clr-namespace:PrismMain.Views"

             mc:Ignorable="d"

             xmlns:prism="http://prismlibrary.com/"

        prism:ViewModelLocator.AutoWireViewModel="True">

    <StackPanel>

          <Button Content="Navigate To Second" Margin="5"  Command="{Binding NavigateCommand}" Width="150"/>

    </StackPanel>



</UserControl>

First.xaml.cs

public partial class First: UserControl

    {

        public First(FirstViewModel viewModel)

        {

            InitializeComponent();

            DataContext = viewModel;

        }



    }



    

FirstViewModel

  class FirstViewModel

    {

        public FirstViewModel(IRegionManager iregionManager)

        {
             NavigateCommand = new DelegateCommand(Nevigate);

            IregionManager = iregionManager;

        }



        private void Nevigate()

        {

            IregionManager.RequestNavigate("MainContent", "Second");

        }


        public ICommand NavigateCommand { get; }

        public IRegionManager IregionManager { get; }


    }

2.Second.xaml

<UserControl x:Class="PrismMain.Views.Second"

             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

             xmlns:local="clr-namespace:PrismMain.Views"

             mc:Ignorable="d"

             xmlns:prism="http://prismlibrary.com/"

        prism:ViewModelLocator.AutoWireViewModel="True">

    <StackPanel>

          <Button Content="Navigate To First" Margin="5"  Command="{Binding NavigateCommand}" Width="150"/>

    </StackPanel>



</UserControl>

    

Second.xaml.cs

public partial class Second: UserControl

    {

        public First(SecondViewModel viewModel)

        {

            InitializeComponent();

            DataContext = viewModel;

        }



    }

SecondViewModel

  class SecondViewModel

    {

        public SecondViewModel(IRegionManager iregionManager)

        {

            

            NavigateCommand = new DelegateCommand(Nevigate);

            IregionManager = iregionManager;

        }



        private void Nevigate()

        {

            IregionManager.RequestNavigate("MainContent", "First");

        }



       

        public ICommand NavigateCommand { get; }

        public IRegionManager IregionManager { get; }



    }




    

To navigate between these Views we need to register these views, for this we need to Implement IModule interface.

Here's how you can implement it:

 class MainModule : IModule

    {

        public void OnInitialized(IContainerProvider containerProvider)

        {

            var region = containerProvider.Resolve<IRegionManager>();

            region.RegisterViewWithRegion("MainContent", typeof(Main));

          //here i register the MainContent region of Main.xaml

        }



        public void RegisterTypes(IContainerRegistry containerRegistry)

        {

      

            containerRegistry.RegisterForNavigation<First>();

            containerRegistry.RegisterForNavigation<Second>();

          

        }



    }
  

Here MainContent is region name which is present in Main.xaml where these views are navigated.

Main.xaml

    

<metro:MetroWindow x:Class="PrismMain.Views.Main"

        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:PrismMain.Views"

        mc:Ignorable="d"

        xmlns:prism="http://prismlibrary.com/"

        xmlns:metro="http://metro.mahapps.com/winfx/xaml/controls" >

<Grid>

     <ContentControl prism:RegionManager.RegionName="MainContent" />

 </Grid>

</metro:MetroWindow>
 
 

Now time to configure Module to do this we need to override ConfigureModuleCatalog method inside App.xaml.cs

App.xaml.cs

 public partial class App

    {

     

        protected override Window CreateShell()

        {

            var shell = Container.Resolve<Main>();//where Main is a window to display on start up which present in view folder

            return shell;

        }

       

        protected override void RegisterTypes(IContainerRegistry containerRegistry)

        {

            

            

        }

        protected override void ConfigureModuleCatalog(IModuleCatalog moduleCatalog)

        {

            base.ConfigureModuleCatalog(moduleCatalog);

            moduleCatalog.AddModule<MainModule>();

        }

    }