When I first got exposure to Xamarin.Forms at Xamarin Evolve I was a bit skeptical.  I always figured that one of the great strengths of Xamarin was the specific UIs it allowed you to create allowing the app to fit with the design of the targeted platform.  This, in my opinion, gave it a huge advantage over HTML5 which would often require a single UI for all platforms.  So, I was curious why Xamarin had opted to pursue a strategy which would forfeit this advantage, or so I thought.

It turns out Xamarin has found a means to share even more code without compromising its ability to provide platform centric UIs.  Granted, right now, Forms, is primarily targeted at Line of Business apps where the UI can be generalized across the platforms.  Apps that require a heavily customized UI are best left to use vanilla Xamarin.

Forms works by defining a central Core project which contains the all important App class that defines app lifecyle handling and the start page.  Each supported platform has a separate project that references the Core project’s App class.  Within the Core project we define our pages, usually using Xaml, and define navigation between them.

When the app is run, the Xaml is turned into either ViewControllers, Activities, or PhoneApplicationPages by Forms.  This is done by using Renderers which look at the elements used in the Xaml and output the appropriate control for that element.  For example:

The Entry control represents a editable textfield which is supported in all platforms.  When the iOS version of the application is run the EntryRenderer will take this and create a UITextField from it.  Similarly, it will create an EditText on Android and a TextBox on Windows Phone.

In addition, developers are free to create their own renderers to alter controls as they see fit, both native and custom.  These renderers are implemented within the platform specific project and exported to the main system.  A full introduction to their usage can be found here: http://developer.xamarin.com/guides/cross-platform/xamarin-forms/custom-renderer/

Score Predict

One of my personal side projects is Score Predict which is a game that allows users to predict the scores of football games and get points depending on how close they are.  I originally spent most of last year writing this in native iOS and Android.  It was beyond painful and left me with no time or energy to support Windows Phone.  In addition, it became impossible to add new features because it would take me weeks to develop the feature for the other platform.  So I decided to use Xamarin.Forms.

The results have been incredible.  Within two weeks, I have completed 30% of the app in Android, iOS, and Windows Phone.  The app looks incredible (big thanks to my brother @brandclay for the new logo) and adding new features is a simple update that affects all three platforms.  This even puts me ahead of MVVMCross because I dont have to create the UI for the feature more than once.

Furthermore, I have found limited cases where I have to do something platform specific.  Mainly it has been the addition of a title to pages on Windows Phone because it doesnt support a navigation bar, and customizing the text colors for the Entry fields for each platform so they match the theme.

Keep in mind that the UI for Score Predict is relatively simple and falls within the apps that Xamarin.Forms makes sense for.  If this was an app requiring heavier amounts of customization I would probably gone back to vanilla Xamarin with MVVMCross.