MVVM – Navigation

In the next few posts I’ll look at some aspects of WPF development that are often cited as excuses for not adopting the MVVM design pattern. Using the techniques I’ve introduced in previous posts, I’ll create some library functions that offer a clean-code way to solve these ‘hard’ MVVM problems.

The first issue to look at is how to open a new window and then close it again, all from within the ViewModel layer. The key tenet of MVVM is the clear separation between the user interface and business logic, so we shouldn’t write code like this in the ViewModel …

I’ve already covered services in a previous post – data provision in the StaffManager demo application was extracted from the main ViewModel into a distinct module, that was accessed via an interface. We can do the same for navigation. Any navigation task the ViewModel wants to perform can be added to the application specific INavigationService interface, the implementation of which is defined elsewhere and set at runtime in the IoC container.

In the demo application for this post, the MainViewModel wants to display the selected DataItem in a separate window. The interface required for that is just …

The ViewModel doesn’t need to know how this functionality is implemented – all it cares about is that it can pass in a DataItem instance which will then be displayed to the user. If the ViewModel class is shared between multiple application variants, e.g. WPF / UWP / Xamarin / Windows Phone, there will be a different implementation in each one. In our demo WPF application, the INavigationService interface is implemented as …

The second segment of this issue covers how does the ViewModel close the window again. A good example of this requirement would be an editing dialog – with the standard window close button hidden. The save command can only execute once the entered data is valid, and that in turn will close the dialog. We already have a method for linking the ViewModel to the View – data binding. We can create a suitable property on the ViewModel – it is a nullable<bool> to match the return type of Window.ShowDialog() …

The demo application shows all this functionality in a joined up solution. perDialogBase is an extended Window class that hides the close button and disables the standard Alt-F4 (= close the window) functionality, using a couple of behavior classes. These behaviors are defined using the perBehaviorForStyle wrapper, so that they can be included in a style definition.

In my next post, I’ll continue with this theme by looking at another ‘hard’ MVVM problem – message dialogs.

Don’t forget that all of the code samples for this blog are available on Github, along with my own personal C# / WPF library.