Adding a Windows Phone app to existing a Xamarin.Forms Solution

Xamarin.Forms is great, it is a way to write great native apps that share 100% of code. With Xamarin.Forms, even the UI is shared, and it is in native controls. However, those of us who have the Indie License, but not the $1000 per platform for the Business License, don't get the sweet Visual Studio plugin and automatic Windows Phone App. And since Xamarin makes it so easy to develop on all three platforms, we might as well too.

The Joy of Shared Projects.

Xamarin 3 introduced the shared project type, which Microsoft introduced in April at Build. Xamarin.Forms leverages the same project type (and PCL) to share code on all three platforms. Because of this, adding a Windows Phone app to your Xamarin Studio solution is shockingly simple.

  • Open your solution in Visual Studio, see the failure to load message and move on like a boss.

image of failure

  • Create a new, blank, Windows Phone project. As of this writing, I had to use a Windows Phone Silverlight project type. The nuget package for Xamarin.Forms did not include a Windows Phone 8.1 project type.

new windows phone project

Select target type, Windows Phone 8.0, as of this writing.

no references :(

If adding a reference were this simple, this wouldn't be much of a blog post.

project references

  • Open the your Windows .csproj in your text editor of choice and add this line. I copied this out of the csproj of the Android app after looking at what it was doing

    <Import Project="..\FootballTournament2014\FootballTournament2014.projitems" Label="Shared" Condition="Exists('..\FootballTournament2014\FootballTournament2014.projitems')" />
    

Save the changes and reload your project when prompted.

reference is auto-loaded

  • Add a reference to Xamarin.Forms via nuget. Xamarin.forms nuget

  • Time to code.

Clean out the MainPage.xaml. Mine looked like this.

<phone:PhoneApplicationPage
    x:Class="FootballTournament2014.Windows.MainPage"             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">    
</phone:PhoneApplicationPage>

Update MainPage.xaml.cs to use the shared project.

public MainPage()
    {
        InitializeComponent();

        Forms.Init();
        Content = FootballTournament2014.App.RootPage.ConvertPageToUIElement(this);
    }

VoilĂ , that's it. When you run the Windows Phone application, you will see a native Windows Phone application, running the exact same code as the iOS and Android projects.

Success

It's really great.

Those of us who can't spend $2000 (but wish we could) on additional tooling have a way to target all three app stores using Xamarin.Forms, through a surprisingly simple process.

The code for this sample, can be found here.

comments powered by Disqus