Cross Platform Mobile Development: Xamarin Forms

Cross platform development has become a trending topic in mobile applications over the past few years. While using a native app platform offers many benefits and great features, cross-platform development software simplifies the mobile application creation. Some of the most popular cross-development environments include Sencha, PhoneGap, Titanium and Xamarin. Which one you choose depends on your preferred programming language and the needs and goals for your app.

Xamarin allows developers to write their apps in C# or Ruby, offers performance testing, as well as the ability to do virtual tests. Another benefit is that you can use the Xamarin.Forms API to quickly build native apps for iOS, Android and Windows from a single, shared C# codebase.

Recently, I have been using Xamarin for mobile application development. To help in the learning process for developers who are new to Xamarin, here is a summary of how to get started with Xamarin.Forms and how to use it.

When we consider developing mobile apps we generally think of using Objective-C, Java and/or Swift languages to develop it. That said, learning a new language requires extra effort and time for any .NET developer. On top of that, if we want to develop Android and iOS applications at the same time we must learn a variety of new technologies. Xamarin solves these issues for .NET developers. Xamarin provides a single language to develop native applications on several platforms including iOS, Android and Windows Phone. Xamarin is composed of Xamarin.iOS, Xamarin.Android and Xamarin.Forms. Below I will take an in-depth look at the relevant content of Xamarin.Forms.

As explained in the Xamarin developer forum:

The Xamarin.Forms is a cross-platform framework that allows developers to create user interfaces which can be shared across Android, iOS, Windows and Windows Phone. The user interfaces are rendered using native controls of the target platform. For different platform, Xamarin.Forms applications can retain the native look and feel.

When writing Xamarin.Forms application, large portion of codes can be written in the shared code, platform specific codes can be written in each platform. There are two approaches to handle the shared code. One is to use Portable Libraries, the other is to use Shared Projects. In Portable Class Library (PCL), when code is compiled, assemblies (dlls) are generated for each platform. In Shared Project, a number of different application projects can reference common code. There are two methods to create user interfaces. One is to use C# code, the other is to use XAML. So it’s easier to get Xamarin.Forms started for those who have WPF experience. Though controls are enough in Xamarin.Forms, you can also implement renderers in each platform to create the appropriate user interface.

As we can see, there are many differences between mobile apps and desktop applications. For developers who are new to developing mobile apps, it’s important to note that. For example, we are accustomed to using a checkbox to select anything in desktop applications, while we use a tab in mobile apps. User behavior is not the same either, clicking the mouse is replaced by tapping or swiping the screen.

Development Environment for Xamarin.Forms

Install JDK

<1>Configure Environment Variables

Image and video hosting by TinyPic

<2>Add JAVA_HOME variable

Image and video hosting by TinyPic

<3>Modify CLASSPATH variable


Image and video hosting by TinyPic

<4>Modify Path variable

Image and video hosting by TinyPic

Install Android SDK

Open Android SDK Manager to update Android SDK Platform-tools and install API

Image and video hosting by TinyPic

Update Visual Studio for Xamarin.Forms

Image and video hosting by TinyPic

Image and video hosting by TinyPic


Image and video hosting by TinyPic

Create App by Xamarin.Forms

Create a Xamarin.Forms project

Image and video hosting by TinyPic

Structure of Xamarin.Forms project

Image and video hosting by TinyPic

<1>Portable Class Library (PCL)

   Shared codes are written in this project, we can add xaml page to show UI like WPF application.

<2>Specific platforms (Android, iOS, Windows, WinPhone)

   For each platform, we can add specific codes such as splash screen and so on.

Show “Hello Xamarin”

<1>In HelloPage.xaml, add a label control and set text to “Hello Xamarin”.

Image and video hosting by TinyPic

<2>In App.cs, set MainPage to HelloPage class.

Image and video hosting by TinyPic

Run App on emulator

We can create default emulators in Visual Studio. We can also use Genymotion, it’s faster than default emulators.

Image and video hosting by TinyPic

Using the above introduction, you will be able to create an app with Xamarin. In a follow-up posts I will share how to learn the practical skills and features of Xamarin.Forms, including how to change default style of controls, how to use methods of specific platform in PCL project, how to add Jar package and service reference, and more.

Add new comment