Overview

I was fascinated by the idea of developing cross-platform mobile apps from within the comforts of Visual Studio. This led me to explore Mono and the Xamarinsuit for almost a year now. What I was missing was the ability to abstract common functionality and presentation behaviour from platform specific views. While Portable Class Libraries and Plugins helped realize better reusability across platforms, however I still needed a way to make the presentation layer isolated and unit testable.

MvvMCross and Ninja Coder

MvvMCross made me realize a better way to develop cross-platform apps using Xamarin based on the Model-View-ViewModel pattern. Ninja Coder, is a nice little utility that shrink wraps MvvMCross framework, and takes care of referencing the appropriate assemblies in your solution to create projects based on Xamarin and MvvMCross. After installing Ninja Coder, you will see the MvvMCross templates listed under the new projects menu, however a better option is to create your projects using the Tools ? Ninja Coder for MvvMCross ? Add Projects menu. It lets you select the type of platform projects you want to target in your solution, along with Core, which acts as the reusable library for common features, plugins and ViewModel.

Note that while you can use the project menu to create projects based on MvvMCross, however the recommended option would be to use the one illustrated in the figure above, since it takes care of referencing the Core assemblies in other platform specific projects.

The Core project has an App class that acts as the entry point for launching the landing page view. The MvxApplication class provides the RegisterAppStart method, where you can register the landing page ViewModel to launch.

public class App : MvxApplication    {        /// 
        /// Initializes this instance.        /// 
        public override void Initialize()        {            this.CreatableTypes()                .EndingWith("Service")                .AsInterfaces()                .RegisterAsLazySingleton();             //// Start the app with the First View Model.            this.RegisterAppStart();        }    } 

You can use the Tools menu to add ViewModels and Views to the solution. The ViewModel will be created in the Core project with one View per target platform created in each relevant project.

You can also specify the navigation options for the View.

Note that the View Model Name textbox is smart enough to realize the case sensitivity, and you should always append the name with a ViewModel suffix. Also, don’t create a View Model which is named just ViewModel since the command properties are auto generated, and will cause name conflicts in the project.

Another issue to note, whenever you have an Android or iOS project added, The Views are not automatically created. You need to specifically create the relevant files (.axml for Android) under the resources folder.

The Content loader view class within the project can then launch the view you are referring.

public class SecondView : BaseView    {        /// 
        /// Called when [create].        /// 
        /// The bundle.        protected override void OnCreate(Bundle bundle)        {            base.OnCreate(bundle);            SetContentView(Resource.Layout.SecondView);        }    } 

Plugins

The Ninja Coder utility allows you to configure a host of predefined plugins that you can use with your application. You can use the tools menu to add the plugins you need.

You can also specify the ViewModel that implements the plugin. In our example I have chosen the accelerometer implementation for the SecondViewModel, and you will see the last reading being fetched.

/// 
        /// Gets the last reading.        /// 
        /// The Last Reading.        public MvxAccelerometerReading GetLastReading()        {           return this.accelerometer.LastReading;        } 

Summary

Ninja Coder can really shorten your learning cycle on the best practices for building a unit-testable UI layer with presentation logic isolated from the View implementation for different mobile platforms using Xamarin and MvvMCross.