There are primarily 3 patterns to choose when developing mobile applications. They are MVC, MVVM and MVP. For a detailed discussion about them check Xamarin application architecture.
The focus of this post will be around MVVM pattern. One of the earliest and most stable MVVM libraries for Xamarin has been the MVVM Cross library Like most libraries, this also followed a ViewModel-first approach. What this means, that the focus of the developer is always on the ViewModel and the data in the application. All transitions and animations are also data dependent, which means a user moves from one ViewModel to another and not from one screen to another. It’s quite a capable library but suffered from certain limitations, such as no preview in Android layouts due to embedded binding information in ‘.axml’ files, no header view for listviews etc. Also, to use this, developer requires native UI development experience as well. That being said, it is still quite a capable library and most applications can be written using this.
Xamarin forms, on the other hand, allows better preview of UI, even live updates (using live player). Most developers with ASP.net and XAML experience and without any mobile experience can start writing mobile applications targeting Android, iOS and Windows. However, it is a UI-first approach, which means, the developer is concerned more about UI and data becomes secondary.
Below we will look at a way of ViewModel-first approach in Xamarin Forms, allowing developers with XAML experience to quickly start writing mobile apps. The complete application can be downloaded from here ViewModel-first xamarin forms sample
First is our BaseViewModel
ViewModel-first navigation
Next is our main contract for navigation within the application
The implementation of this contract will allow transition from one screen to another, by only providing the ViewModel’s type and optional parameter.
In the sample application, Autofac is being used for IoC. For more information check it out here.
For implementing the ViewModel-first approach, we will use an anti-pattern, that is Service Locator. It is labelled as such because of the complexity of resolving dependencies when the code base is quite large, and it only works well in simple scenarios. This is exactly the case with a View and it is ViewModel. In most applications, each view will only have one view model, and each view model only caters to one view. Thus, this pattern becomes a perfect candidate for this situation.
Service Container with IoC
Below is the code for AppContainer.cs, where we register all services. Note the mocked services used for Automation. For more discussion about Automation in Xamarin check out Enterprise testing in Xamarin.
The LoadViewModel method is utilised for locating view model for a view.
A BaseView class is created, which acts as the parent for all views inside the application and takes care of loading its view model as shown below. This is where we use Service locator pattern to load ViewModel for the view.
Implementation of ViewModel-first contract
Below is the NavigationService class that implements INavigationService contract.
UI transition using ViewModel
In the sample application, we have search screen and a result screen. Using above service, we can move from Search screen to the result screen using the code below.
Thus, using Service locator pattern, and an IoC type service container we are able to develop mobile applications in Xamarin Forms using the ViewModel-first approach.