Xamarin.Forms XAML Hello World

xamarin_forms

Writing cross platform native applications just got a lot easier with Xamarin.Forms. I really like the aspect of being able to write my UI in XAML. Though to be fair I just want to state that it is a XAML-dialect and does differ from the XAML controls you may know from Apps or WPF written for Windows (Phone).

The basics

To be able to write Xamarin.Forms applications at least an Indie license is required for Android and iOS. To add Windows Phone i.e. develop in Visual Studio a XYZ license is required. I’ll be using Visual Studio for the next steps as my employee provides me with an Enterprise license for development. So first thing is to create a new Xamarin.Forms (PCL) project. This will create a solution with four projects. One for each platform and a core library i.e. the PCL.

Xamarin_forms_solution

######

Adding the XAML-page

the plattform projects all call the app.cs class which is located in the shared PCL library. This is the main starting point for any Xamarin.Forms Application. The originally generated code will crate a page and use code behind to genearte the code. So now lets add a XAML page to replace it:

Xamarin_forms_add_page

It’s XAML time

Now we can add our infamous “Hello World” message to the XAML.

<?xml version="1.0" encoding="utf-8" ?><ContentPage xmlns="http://xamarin.com/schemas/2014/forms"             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"             x:Class="HelloXamarinForms.HelloXamarinForms">    <Label Text="Hello Xamarin Forms" VerticalOptions="Center" HorizontalOptions="Center" /></ContentPage>

Now all we need to do is use the XAML page instead of the pre-generated code behind site. This is done again within the app.cs class which we can find in the core PCL library, where we adjust the original main page from:

// Default RootPageMainPage = new ContentPage{    Content = new StackLayout    {        VerticalOptions = LayoutOptions.Center,        Children = {            new Label {                XAlign = TextAlignment.Center,                Text = "Welcome to Xamarin Forms!"            }        }    }};

to:

MainPage = new HelloXamarinForms();

Now all we need to do is punch the good old F5 and et viola the app loads our XAML-“Hello world” message. So in conclusion yes you can write your views in XAML when using Xamarin.Forms. The names of the controls are different but the concepts behind the logic remains the same and therefore the same gains can be made.

HTH

Updated: