Creating the UWP project

Now let us create the UWP project based on Xamarin.Forms. Add a new Blank App (Windows Universal) project to the solution:

Select the proper version of Windows 10:

Install the Xamarin.Forms package in the NuGet Package Manager:

Or use the command below in the Package Manager Console:

Install-Package MvvmCross.Forms

Then install the MvvmCross.Forms package in the NuGet Package Manager:

Or you can input the command below in the Package Manager Console:

Install-Package MvvmCross.Forms

Then add the references to the MvvmCrossDemo.Core project and the MvvmCrossDemo.Forms.UI project by right-clicking the MvvmCrossDemo.Forms.Uwp project in the solution explorer:

Open the App.xaml.cs file and add a new class with name UWPApplication, as shown below:

public abstract class UWPApplication : MvxWindowsApplication<MvxFormsWindowsSetup<Core.App, UI.App>, Core.App, UI.App, MainPage>
{
}

Update the App class to inherit from UWPApplication class and remove all the other pre-generated methods except for the constructor. Only keep the InitializeComponent() method in the constructor. You can find the source code of this file here: https://github.com/MvvmCross/MvvmCross/blob/develop/ContentFiles/Forms/UWPContent/App.xaml.cs.pp. At last, the App.xaml.cs look like this:

using MvvmCross.Forms.Platforms.Uap.Core;
using MvvmCross.Forms.Platforms.Uap.Views;
namespace MvvmCrossDemo.Forms.Uwp
{
/// <summary>
/// Provides application-specific behavior to supplement the default Application class.
/// </summary>
sealed partial class App : UWPApplication
{
/// <summary>
/// Initializes the singleton application object. This is the first line of authored code
/// executed, and as such is the logical equivalent of main() or WinMain().
/// </summary>
public App()
{
this.InitializeComponent();
}
}
public abstract class UWPApplication : MvxWindowsApplication<MvxFormsWindowsSetup<Core.App, UI.App>, Core.App, UI.App, MainPage>
{
}
}

Accordingly, we need update the App.xaml file to update the base class to make it to inherit from the UWPApplication class, as shown below:

<local:UWPApplication
x:Class="MvvmCrossDemo.Forms.Uwp.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:MvvmCrossDemo.Forms.Uwp">
</local:UWPApplication>

You can find the code of the App.xaml here: https://github.com/MvvmCross/MvvmCross/blob/develop/ContentFiles/Forms/UWPContent/App.xaml.pp.

Open the MainPage.xaml file and add the reference by this code:

xmlns:forms="using:MvvmCross.Forms.Platforms.Uap.Views"

Change the class of the MainPage to MvxFormsWindowsPage. The result is:

<forms:MvxFormsWindowsPage
x:Class="MvvmCrossDemo.Forms.Uwp.MainPage"
xmlns:forms="using:MvvmCross.Forms.Platforms.Uap.Views"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:MvvmCrossDemo.Forms.Uwp"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
</Grid>
</forms:MvxFormsWindowsPage>

You can find the source code of this file here: https://github.com/MvvmCross/MvvmCross/blob/develop/ContentFiles/Forms/UWPContent/MainPage.xaml.pp.

Open the MainPage.xaml.cs and remove the base class of it, like this:

namespace MvvmCrossDemo.Forms.Uwp
{
/// <summary>
/// An empty page that can be used on its own or navigated to within a Frame.
/// </summary>
public sealed partial class MainPage
{
public MainPage()
{
this.InitializeComponent();
}
}
}

Find the sample code here: https://github.com/MvvmCross/MvvmCross/blob/develop/ContentFiles/Forms/UWPContent/MainPage.xaml.pp.

Now the UWP project based on Xamarin.Forms is done. Launch it and you will see the result: