[MVVMbasics] Targeting the Android and iOS platforms via Xamarin.Forms #1

All blog posts with a title that starts with [MVVMbasics] are related to the MVVMbasics framework. If you are only interested in my regular blog posts and not in MVVMbasics, ignore these. To list all articles covering MVVMbasics, go to http://mvvmbasics.mobilemotion.eu/documentation!

New platforms supported by version 2.2 and higher:

Version 2.2 of the MVVMbasics framework adds functionality for creating mobile applications using the Xamarin.Forms platform. Xamarin.Forms enables the creation of native cross-platform applications for the Android, iOS and Windows Phone Silverlight platforms using C#.

With the help of MVVMbasics 2.2 or higher, implementing these Apps following the MVVM patterns is getting a lot easier. In addition, it allows to add Android and iOS support to existing Apps that are based on MVVMbasics with minimal effort: All that needs to be done is implementing platform-dependent services as well as visual pages for the Xamarin.Forms platform.

Project structure:

Xamarin.Forms solutions typically consist of three or four C# projects:

  • A platform-specific project for each target platform – iOS, Android, Windows Phone (only in Visual Studio as Windows Phone development is not supported in Xamarin Studio):
    These projects may contain artwork and platform-specific controls, but typically only one page / activity that instantiates and starts one common App class.
  • A common project that includes all files that are shared between the target platforms:
    This project contains the above-mentioned global App class, as well as any Data Models, Viewmodels, Views, Services, Converters, etc.
    This project can either be a Portable Class Library, or a Shared project. In both cases, it must be referenced by the platform-specific starter projects.

In addition to this project structure, I’d suggest to add another C# project to the solution, which would be a Portable Class Library that targets all Xamarin.Forms platforms and Windows Phone Silverlight, as well as any additional platforms you might want your App to support. In this case, this project would hold all Data Models, Viewmodel, and Service interfaces, while the Xamarin.Forms common project (the PCL or shared project mentioned in the list above) would only contain Views, Converters, and Service implementations.

This architecture allows to add platform-specific projects that target, for example, WPF or Windows Store Apps, at a later point in time. You could then re-use all the Data Models and Viewmodels on all additional platforms and need to re-implement only Views and platform-specific services.

Project setup in Visual Studio:

Project setup in Visual Studio and Xamarin Studio follows similar rules, however there are a few steps that need special attention in Xamarin Studio, therefore I’ll cover these in a separate section in the second part of this article.

In general, the simplest way of setting up an MVVMbasics application is using the MVVMbasics Project Templates which can be downloaded from Visual Studio Gallery: If you have the project templates installed as Visual Studio extension, just create a new solution of type Multi-Platform Application Core using MVVMbasics (which can be found within the Visual C# -> Multi-Platform category). The solution will contain one project which is a Portable Class Library, which will contain all your Models, Viewmodels, and Service interfaces. Then, add a new project of type Xamarin.Forms App for MVVMbasics Core project to the solution: Several projects will be created automatically, one for each target platform and one PCL that will contain all your Views and Service implementations!

If you’d like to create the project structure manually (or need to add MVVMbasics support to an existing project), simply follow these steps:

  1. If the project doesn’t exist already, create a new project in Visual Studio and choose one of the Blank App project types found in the Visual C# -> Mobile Apps category (depending on whether you like a Portable Class Library or a Shared Project as common Xamarin project), and name it like your desired application’s name:MVVM pattern: Hierarchy of layersIn addition, add an additional project of type Class Library (Xamarin.Forms Portable) to the solution. I usually call this project “Core” since it will contain the core functionality for all target platforms, but you can name it whatever you want – just don’t be confused as I will refer to this project as the Core project within this article.
  2. Add a reference to the MVVMbasics framework to all those projects (even the platform-specific Android / iOS / WinPhone projects). To do so, use either the visual Nuget Package Manager or the Package Manager Console to download and install the MVVMbasics library, and make sure that version 2.2.x (or newer) has been installed. You’ll notice that two new references MVVMbasics and MVVMbasicsXF have been added to most of the projects.
  3. Add the respective Models, Viewmodels, Services, etc. namespaces to the Core project. For details about how to create the Models, Viewmodels, and Service interfaces, please refer to the MVVMbasics Documentation & Tutorials page.
    The Xamarin.Forms common project should already contain one class file App.cs. To create pages, add a new Views namespace and create at least one file of type Forms Xaml Page. For details about how to implement the App class and the pages, please see the section Implementing Views and the App class in the second part of this article!