Level-up your Xamarin apps with HOW-TO Prism!? Part 1/24 min read

Learn how PRISM improves your application

Hi! Today I will give you some rough overview of how PRISM works and what PRISM is.

Before I came in touch with PRISM, while developing Xamarin apps, I’ve integrated MVVM by hand. But using PRISM all that cumbersome work was lifted and MVVM became joy to work with.

Why would I want to use MVVM library?

If you have ever worked on a complex, large scale, WPF or Xamarin Forms project, where architecture is a must (clean code, patterns, unit-tests, etc), you have probably come across one of the MVVM libraries.

There are a number of libraries for MVVM like MVVMCross, MVVMLigth, Prism, etc.

We use those libraries, or better to say one of them, to make our life easier while working with MVVM pattern. It pretty simplifies MVVM usage.

So what is MVVM?

MVVM stands for Model View ViewModel and it’s an architectural pattern for building a user interface. Since it decouples our code, it makes our code possible to unit test. Try unit test XAML application without MVVM pattern!
Well, good luck! No really, good luck! 🙂

The idea behind MVVM is to separate domain model, which is M in MVVM, View which is a page in Xamarin world, and ViewModel which is a model specifically designed for the view/page.

In a coding jargon, it’s a POCO or a class with properties tied to the state of the view and methods with the logic behind the view.

WHY PRISM AND NOT OTHER FRAMEWORK?

Not much here to say since the company I work for already implemented this framework in desktop WPF application. So it was no-brainer when I moved to Xamarin Forms applications and started doing XAML programming. Since this framework covers all my needs for MVVM pattern in any XAML application I didn’t have any need to dive into some other MVVM library. I guess they are all fine and easy to grasp on.

WHY PRISM?

So, to get back to our star in this post, Prism.
Here are few whys:

• XAML code unchanged
• enhances overall application structure
• lowers code coupling
• easier unit testing

PRISM SNEAK PEEK!

To include Prism, head to nuget packages and type “Prism”. Add it.
With Prism we cover a lot of things inside our application:

• navigation
• event handling
• ui dialogs
• dependency services
• messaging

Navigation

After you added Prism and created an application we head to MainApp class:

  public partial class App : PrismDemoApp
{
public App(IPlatformInitializer initializer = null) : base(initializer) { }
protected override void OnInitialized()
{
InitializeComponent();
NavigationService.NavigateAsync("NavigationPage/MainPage?title=Hello%20World");
}
protected override void RegisterTypes()
{
Container.RegisterTypeForNavigation<MainPage>();
Container.RegisterTypeForNavigation<SecondPage,SecondPageViewModel>();
}
}

We register here two pages for navigation. Hence that View is referred to as the page. In our initialization method, we trigger our MainPage view with a parameter called “title“.

Furthermore, each page is registered with belonging ViewModel.
Here we can also explicitly define ViewModel.
By default is PageNameViewModel.
Adding the second parameter in Container.RegisterTypeForNavigation we explicitly say which ViewModel belongs to our page.

Injection service

If you want to use any of listed things you have to inject services related to each thing you want to implement i.e.:

public MainPageViewModel(INavigationService navigationService,
IPageDialogService dialogService)
{
}

Core concepts

Core concept while coding MVVM Prism is this:

1. create ui element
2. bind ui element to command
3. create DelegateCommand
4. create command implementation

i.e. for basic navigation with one parameter:
[VIEW]

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
prism:ViewModelLocator.AutowireViewModel="True"
x:Class="PrismDemoApp.Views.MainPage"
Title="MainPage">
<StackLayout HorizontalOptions="Center" VerticalOptions="Center">
<Button Text="Go to Page 2" Command="{Binding GoToPage2}"></Button>
</StackLayout>
</ContentPage>

[VIEWMODEL]

  public class MainPageViewModel : BindableBase
{
public DelegateCommand GoToPage2 { get; private set; }
public MainPageViewModel(INavigationService navigationService)
{
_navigationService = navigationService;
GoToPage2 = new DelegateCommand(GoToSecondPageNavigation);
}
public void GoToSecondPageNavigation()
{
var param = new NavigationParameters();
param.Add("param1", "someValue");
_navigationService.NavigateAsync("SecondPage", param);
}
}

Basically, the whole idea is as seen above.

There is much more while using Prism, of course, but we will cover that in Part 2.