MVVM Light For Windows 10 Universal App

The MVVM Light Toolkit helps you to separate your View from your Model and View model, which creates Applications, that are cleaner and easier to maintain.

Let’s see the steps.

First, install the MVVM Light toolkit. For it, you need to click here , download and install it, as shown below:



Once installed successfully, create new Application with MVVM Pattern, shown in the screenshot, given below:.



Once created, look at the Solution Explorer, shown in the structure, given below:



If you already have a project, just install the MVVM Light, using NuGet Package Manager. Right click on the Reference and select the NuGet Package Manager. Search mvvm light toolkit and install it, shown in the image, given below:.



Let’s see the important points.

ViewModelBase: All the VieModel need to inherits from ViewModelBase and uses its methods. Like the following code.

public class MainViewModel : ViewModelBase
{
}

You need to register all the view model in ViewModelLocator, using the code, given below:

SimpleIoc.Default.Register<MainViewModel>();

To get the instance of the viewmodel, use the following:

public MainViewModel Main => ServiceLocator.Current.GetInstance<MainViewModel>();

NavigationService: Using this, we can navigate from one page to another page, using the code, given below:

public class MainViewModel: ViewModelBase
{
    private readonly INavigationService _navigationService;
    public MainViewModel(INavigationService navigationService) {
        _navigationService = navigationService;
        _navigationService.NavigateTo("Page2");
        Initialize();
    }
}
To Navigate back
_navigationService.GoBack();

DialogService: To show a dialog in MVVM Light, we can use DialogService to display a dialog Windows, using the code, given below:

var dialog = ServiceLocator.Current.GetInstance<IDialogService>();

await dialog.ShowMessage("MVVM Light ToolKit","http://windowsapptutorials.wordpress.com/");

For showing the dialog using ICommand, read my previous article, whose link is given below:  

• Showing Message Dialogs When Using MVVM Pattern In Windows 10 UWP APP

We will see more details in the upcoming articles.