How to navigate to a different region layout using Prism and Unity?

Question

I'm writing a WPF application and using Prism and Unity to navigate from screen to screen. The problem I've got is my screens have different region layout outs.

For example (please see the image), the 1st screen has 2 regions (region 1 and region 2) and when the user clicks a button it navigates to the 2nd screen which has only has 1 region (region 3).

I can't get it working. I've also tried hiding region 2, and injecting the 2nd screen into region 1. It hides region 2, but doesn't collapse it. So there is a big white space on the right hand side.

I found this article on Stack Overflow that says have region in the Shell.xaml file, and create another region to display the multiple region layout.

So my Shell.xaml file looks like this:

<ContentControl prism:RegionManager.RegionName="{x:Static inf:RegionNames.ShellMainRegion}" />

And I register the regions, view models and views in the Initialize method of a class that implements the IModule interface.

_container.RegisterType<IRegion1And2ViewModel, Region1And2ViewModel>();
_container.RegisterType<IRegion1And2View, Region1And2View>();

_container.RegisterType<IRegion1ViewModel, Region1ViewModel>();
_container.RegisterType<IRegion1View, Region1View>();
_container.RegisterType<IRegion2ViewModel, Region2ViewModel>();
_container.RegisterType<IRegion2View, Region2View>();
_container.RegisterType<IRegion3ViewModel, Region3ViewModel>();
_container.RegisterType<IRegion3View, Region3View>();


IRegion shellMainRegion = _regionManager.Regions[RegionNames.ShellMainRegion];

var region1And2VM = _container.Resolve<IRegion1And2ViewModel>();
IRegionManager region1And2RegionManager = shellMainRegion.Add(region1And2VM.View);

IRegion region1 = region1And2RegionManager.Regions[RegionNames.Region1];
IRegion region2 = region1And2RegionManager.Regions[RegionNames.Region2];

var region1VM = _container.Resolve<IRegion1ViewModel>();
var region2VM = _container.Resolve<IRegion2ViewModel>();
region1.Add(region1VM.View);
region2.Add(region2VM.View);
region1.Activate(region1VM.View);

var region3VM = _container.Resolve<IRegion3ViewModel>();
shellMainRegion.Add(region3VM.View);

When I run the app it shows the first screen fine (with regions 1 and 2). But when I click the button and call the following code the region 1 and 2 layout remains and the Region 1 view is no longer displayed, and the region 3 view (which should be displayed in the shell main region) isn't displayed at all.

IRegion shellMainRegion = _regionManager.Regions[RegionNames.ShellMainRegion];
shellMainRegion.RequestNavigate(typeof(Region3View).Name);

Can someone please show me the code I need to display screens with different region layouts using Prism and Unity?

Thank you

Answer 1

First, you should really be using the latest version of Prism, which is 6.3 at this time. The links you included in your question are for a version that is old, and not really supported any more. The latest bits can be found here: https://github.com/PrismLibrary/Prism . You can add the latest version to your project/solution via NuGet .

Now to your issue, navigation. You seem to have a reference to the region manager ( _regionManager ) in the code that is written to do the RequestNavigate call. But, you are not using is properly. Rather than grab a reference to the ShellMainRegion , simply call the RequestNavigate method off of the region manager.

_regionManager.RequestNavigate(RegionNames.ShellMainRegion, typeof(Region3View).Name);

What this does is tell the region manager to find the shell region, and show Region3View in it.

So, this line of code:

IRegion shellMainRegion = _regionManager.Regions[RegionNames.ShellMainRegion];

is no longer needed.

Hope this helps you out!