Creating a Xamarin Forms App Part 3 : How to use Xamarin Forms with Visual Studio without the Business Edition.

  • Part 1 : Introduction
  • Part 2 : Getting Started
  • Part 3 : How to use Xamarin Forms with Visual Studio without the Business Edition
  • Part 4 : Application Resources
  • Part 5 : Dependency Injection
  • Part 6 : View Model First Navigation
  • Part 7 : Unit Testing
  • Part 8 : Consuming a RESTful Web Service
  • Part 9 : Working with Alerts and Dialogs
  • Part 10 : Designing and Developing the User Interface
  • Part 11 : Updating to Xamarin Forms 1.3
  • Part 12 : Extending the User Interface

This week Xamarin announced support for Visual Studio Community in the Starter edition. More on this here. It is still unclear what this means for Xamarin Forms which is currently only available with the Indie licence and above. If Xamarin does include Visual Studio Community support with the Indie licence then it will be great news for individual developers and small businesses who will no longer need to purchase the costly Business edition ($999 per platform) or be confined to using Xamarin Studio.

However, in the meantime this post will show you how to use Visual Studio to develop Xamarin Forms Applications using the Indie licence without purchasing the Business Edition

I have an Indie licence for both iOS and Android, for which I managed to negotiate a discount as a small business. It is however a bit crazy that we have start negotiating special discounts just because the price is way to high in the first place. This allows me to develop Xamarin Forms applications using Xamarin Studio for both these platforms, but not using Visual Studio. I don’t really understand the logic here but I do think Xamarin need to reconsider this as it is only going to hamper and annoy most developers.

If you want to develop for Windows Phone then you need to use Visual Studio. This may seem like you need to have the Business Edition to do this but that is not the case. Although the Xamarin pricing page shows that Visual Studio support only comes with the Business Edition, this only applies to iOS and Android. This is something that is far from clear and many developers may be excused for thinking that you need the Business Edition to target Windows Phone with Xamarin, you don’t.

You can simply open an existing solution in Visual Studio, which you’ve previously created in Xamarin Studio, and add a Windows Phone project that supports Xamarin Forms. Furthermore, you can then work on the shared PCL’s in that solution and build them without any problems. It won’t however let you build a solution that contains an iOS or Android project. I will show you how to get around this and allow you to develop most of your code in Visual Studio and then run and deploy it against all three target platforms.

So, let’s get started.

We left off in Part 2 with a solution we created in Xamarin Studio. I run Windows on my Mac via Parallels as a Virtual Machine. This means I have access to the same files on my local drive in both OSX and Windows. If you are running Visual Studio on a separate PC then you will need to make sure that you have access to the same solution files that you created in Xamarin Studio, either via a network share or source control. What I’m going to show you here however is based on sharing the same files in Xamarin Studio on OSX and Visual Studio on ­­­Windows.

Firstly, open the solution we created in part 2 in Visual Studio on Windows. If you try to build the solution you will get an error informing you that the project requires Xamarin Business Licence or greater. Ignore all these errors.

We need to create a separate solution that doesn’t contain the iOS and Android target projects but instead contains a Windows Phone project. Select the solution and then choose File > Save As from the menu. Name the solution the same except add ‘.WinPhone’ to the end. e.g. Silkweb.Mobile.MountainForecast.WinPhone.sln

Now remove the iOS and Android projects from solution by right clicking them and selecting ‘Remove’. At this point if you build the solution you will still get the same errors. The trick here is to close Visual Studio down, then re-open it and reload the solution. Now when you build the solution it should succeed. This is the key thing here because you can now edit and add classes to the shared PCL class libraries and work with Xamarin.Forms without needing a Business License. Everything will build without errors (provided they’re not yours!)

Next we need to add a Windows Phone Project. Right click on the Platforms solution folder we created earlier and choose Add > New Project.

From Store Apps > Windows Phone Apps select ‘Blank App (Windows Phone Silverlight)’.

Note: don’t choose Blank App (Windows Phone) because this targets Windows Phone 8.1 only and won’t work with the current version of Xamarin.

Name the project the same as for the other target projects except add .WinPhone to the end instead of iOS or Android. This should be the same name as the solution. i.e. Silkweb.Mobile.MountainForecast.WinPhone.

1

You will then be prompted to choose the Target Windows Phone OS Version. Leave this at Windows Phone 8.0 and proceed.

2

Now add references to the PCL class libraries in the solution to the WinPhone project and set it as the Start Up project.

Your solution should now look like this:

3

Next we need to add a reference to Xamarin.Forms. Right click on References and select ‘Manage NuGet Packages’. Search for Xamarin.Forms and add this package to the project.

4

This will add a reference to Xamarin.Forms and also create a Toolkit.Content folder with a number of images. You’ll need to change the Copy to Output Directory property for all these files from ‘Do not copy’ to ‘Copy always’.

Next we need to update the MainPage.xaml with the following Xaml. Make sure you change the namespace of the x:Class to your own.

<phone:PhoneApplicationPage  
    x:Class="Silkweb.Mobile.MountainForecast.WinPhone.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>

And finally we need to update the MainPage.cs code behind to load our Xamarin.Forms page. Again, make sure you change the namespaces according.

using Microsoft.Phone.Controls;
using Xamarin.Forms;
using Silkweb.Mobile.MountainForecast;

namespace Silkweb.Mobile. MountainForecast.WinPhone
{
    public partial class MainPage : PhoneApplicationPage
    {
        // Constructor
        public MainPage()
        {
            InitializeComponent();

            Forms.Init();
            Content = Silkweb.Mobile.MountainForecast.App
				.GetMainPage()
				.ConvertPageToUIElement(this);
        }
    }
}

And that’s it. Build the solution and you shouldn’t get any errors. Now run it using the Windows Phone emulator and you should see the MainPage in all it’s glory!

5

Ok, so it’s not that impressive. But we are now also targeting Windows Phone as well as iOS and Android without using the Business Edition.

If this were the end of this post then I wouldn’t really be showing you what I set out to show you. This is only the set up to provide you with a workflow that will enable you to develop against all 3 platforms using Visual Studio. But this solution only targets Windows Phone right.

Now return to OSX land and open the original solution in Xamarin Studio. You should now have the Windows Phone solution open in Visual Studio and the iOS and Android solution open on your Mac in Xamarin Studio. Essentially these two solutions are the same except for the platforms they target. Now return to Visual Studio as we are going to now write all our code from there and benefit from Resharper if you have that installed.

Let’s do some very basic MVVM. From the solution in Visual Studio create a View Model in ViewModels folder and call it MainViewModel.cs. Now add the following code:

    public class MainViewModel
    {
        public MainViewModel()
        {
            Title = &quot;Mountain Forecast&quot;;
            Forecast = "Tomorrow is going to be nice and sunny";
        }

        public string Title { get; set; }

        public string Forecast { get; set; }
    }

We’re not bothering here with INotifyPropertyChanged (that’s for a later post). What I want to demonstrate is that you can create and edit code in Visual studio. Now in the MainPage.xaml add the following xaml:


<ContentPage 
	xmlns="http://xamarin.com/schemas/2014/forms" 
	xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
	x:Class="Silkweb.Mobile.MountainForecast.Views.MainPage"
	Title="{Binding Title}">

	<Label Text="{Binding Forecast}" />

</ContentPage>

Notice here the bindings to the view model properties. Now in the App.cs change the creation of the MainPage so that we set it’s DataContext to an instance of MainViewModel, like this:

using System;
using Xamarin.Forms;
using Silkweb.Mobile.MountainForecast.Views;
using Silkweb.Mobile.MountainForecast.ViewModels;

namespace Silkweb.Mobile.MountainForecast
{
    public class App
    {
        public static Page GetMainPage()
        {	
            return new NavigationPage(new MainPage 
                {
                    BindingContext = new MainViewModel()
                });
        }       
    }
}

Note what we are doing here is setting the BindingContext of the MainPage to an instance of the MainViewModel. There’s nothing remarkable here other than the fact that you are doing all this in Visual Studio. Now build and run the solution. You should see this in the Windows Phone Emulator:

6

Now quickly switch to Xamarin Studio in OSX and run the solution from there.

7

WoW! How did that happen?

Well, you already now right. We’ve simply changed the classes in the PCL libraries that both solutions are using so obviously you are going to get the same results. What’s interesting though is that you did all this in Visual Studio and only needed to quickly switch to Xamarin Studio and Run it from there. Let’s run it on Android just to get the complete set of 3. Set the Android project in Xamarin Studio as the start up project and run it.

8

Voila!

This shows that you can do 99% of your development in Visual Studio and still run against each target platform using the Indie edition of Xamarin. The remaining 1% is going to be the target platform code we have already created and any custom renderers you may need to create for each platform.

In fact you don’t really need to even run up the Windows Phone emulator at all. All you need to do is save the files and/or build the solution and you are guaranteed to be able to run it on iOS or Android by simply running via Xamarin Studio. Ok, it’s not a perfect workflow, but hey you don’t have to pay $999 x 2 for both Business licenses!

Lastly, the Xaml intellisense support in Xamarin Studio is currently far better than that offered in Visual Studio (see my earlier post on this). This means we can gain the best of both worlds (at the time of writing this post). We can edit our Xaml in Xamarin Studio and gain benefits of it’s intellisense support and edit our C# code in Visual Studio to gain the benefits of Visual Studio and Resharper (if you have it installed). In fact you can use which ever IDE makes sense to you for whatever task and still end up with the same results.

It would be nice however to not have to perform this work around at all. We can only hope that Xamarin do provide support for Visual Studio in the Indie edition so that we can use Visual Studio to develop Xamarin Forms without purchasing the Business Edition.

7 thoughts on “Creating a Xamarin Forms App Part 3 : How to use Xamarin Forms with Visual Studio without the Business Edition.

  1. Nice article and something I wish I’d read before purchasing Xamarin’s Business subscription (though at a reduced price). I think the whole licensing/tooling things needs simplifying. There was a rumour earlier in the year about MS buying out Xamarin. Now that’s something that would have made a whole lot more sense than buying Minecraft, for heavens sake!

    Like

  2. If you try to search the page for MainPageViewModel, you see that it is mentioned 2 times in the text. However, the code samples uses MainViewModel.

    Thanks for the series, it’s great!

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s