Today I will talk about Xamarin.Forms, one of the awesome products of Xamarin.
For those who don’t know much about Xamarin, this company provide C#/.Net based platform for developing cross-platform app completely native and it was open sourced by Microsoft after acquiring (Wow!! Microsoft backed).
Xamarin have many products to cover full lifecycle of mobile development and in earlier post we have seen why and when to choose Xamarin. Now as you have already decided to go with Xamarin for your mobile app development, let us see one of the product provided by them for cross-platform (covering major three platforms: Android, IOS, Windows) Xamarin.Forms.
So let’s get into it and find how good Xamarin.Forms is.
What is Xamarin.Forms?
Xamarin.Forms is a cross-platform natively backed UI toolkit abstraction that allows developers to easily create user interfaces that can be shared across Android, IOS, Windows, and Windows Phone. The user interfaces are rendered using the native controls of the target platform, allowing Xamarin.Forms applications to retain the appropriate look and feel for each platform.
When to choose Xamarin.Forms?
Ask yourself following questions
- Whether this App is for your employees rather than end customer expecting awesome visually appealing App?
- Whether your priority is to share as much code as possible over crafting a beautiful UI for nice user experience?
- Whether your app require less amount of platform specific functionality?
If your answer to above questions is “yes”, you can choose Xamarin.Forms for your mobile app
What Xamarin.Forms is best for?
- Data entry apps
- Prototypes and proofs-of-concept
- Apps that require little platform-specific functionality
- Apps where code sharing is more important than custom UI
What platform one can cover with Xamarin.Forms?
- Android 4.0.3 (API 15) or higher
- iOS 6.1 or higher
- Windows Phone 8.1 (WinRT, using Visual Studio)
- Windows 8.1 Tablet/Desktop Apps (WinRT, using Visual Studio)
- Windows 10 Universal Apps (Phone/Tablet/Desktop, using Visual Studio)
What one should know to start with Xamarin.Forms?
- C# (you don’t need to be an expert, if know any Object oriented programming language, it will be not that different)
- XAML (slightly different from Microsoft XAML)
- Have basic idea about how views look on devices and which kind of view is required in which case.
Benefits of Xamarin.Forms:
- Build native UI for all three platforms with single code base.
- Launch MVP (Minimum Viable Product) app to major platform quickly.
- Highest possible code sharing around 90+ %.
- Active community
- Active development
- . Microsoft owned
Let’s see some code for Xamarin.Forms:
We can create user interface with C# or XAML, it is up to you whichever is easy for you choose that.
Accordingly choose the Forms project based on C# or XAML (in Xamarin Studio for mac and visual studio in windows), for more refer here
Let’s see the code snippet for following screen in C# and XAML
XAML:
<?xml version="1.0" encoding="UTF-8"?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="MyApp.MainPage">
<TabbedPage.Children>
<ContentPage Title="Profile" Icon="Profile.png">
<StackLayout Spacing="20" Padding="20"
VerticalOptions="Center">
<Entry Placeholder="Username"
Text="{Binding Username}"/>
<Entry Placeholder="Password"
Text="{Binding Password}"
IsPassword="true"/>
<Button Text="Login" TextColor="White"
BackgroundColor="#77D065"
Command="{Binding LoginCommand}"/>
</StackLayout>
</ContentPage>
<ContentPage Title="Settings" Icon="Settings.png">
<!-- Settings -->
</ContentPage>
</TabbedPage.Children>
</TabbedPage>
C# :
using Xamarin.Forms;
var profilePage = new ContentPage {
Title = "Profile",
Icon = "Profile.png",
Content = new StackLayout {
Spacing = 20, Padding = 50,
VerticalOptions = LayoutOptions.Center,
Children = {
new Entry { Placeholder = "Username" },
new Entry { Placeholder = "Password", IsPassword = true },
new Button {
Text = "Login",
TextColor = Color.White,
BackgroundColor = Color.FromHex("77D065") }}}
};
var settingsPage = new ContentPage {
Title = "Settings",
Icon = "Settings.png",
(...)
};
var mainPage = new TabbedPage { Children = { profilePage, settingsPage } };
Same code created respective native components on respective platforms.
There are four main control groups used to create the user interface of a Xamarin.Forms application:
At runtime each control will be mapped to its native equivalent, which is what will be rendered.
Views/Cells:
Note:
These are all my opinion on Xamarin.Forms
- Currently Xamarin form is actively developed, with every release it is improving but it still need time to evolve to choose it for great UI based app.
- Currently Form is good for small scale application and may evolve in near future in upcoming releases.
- Component created by form will converted into native component for that platform, example tab component created with Form will not be visually same on all platform, it will get converted to its corresponding native view, like in IOS the tab will be on bottom while on android it will be on top and if we write special platform specific code to make them visually same the purpose of using form is gone as the UI code is not shared.
- Customizing views as per design is not completely possible, you have to compromise with visual design because there are many limitations in Form to make views pixel perfect and exactly same on each platform.
- It is still the best option for any MVP, Prototype, POC.
Give it a try and let me know your views.
Thank you all.
