Getting Started – Xamarin.Forms

Introduction:

Xamarin.Forms is a cross platform UI toolkit that allow user to efficiently create native user interface layout. Code can be shared all the device (IOS,Android , Windows Phone and Win store app) .

System Requirement:

Mac / Windows 7++ Machine with 8 GB RAM
Xamarin Studio 5.0 or new version/ Visual Studio 2012 or new version

Support Devices:

Xamarin.Forms applications can be support following operating systems devices
Android 4.0.3 (API 15) or higher

iOS 6.1 or higher

Windows Phone 8.1

Windows 8.1

Windows 10 Universal Apps

Windows Phone 8 Silverlight


How to create First Xamarin.Form Application?

Step 1:

Open Visual Studio ( Run ➔ Devenv.exe)

My system having following VS version with xamarin


Step 2:

Create New Project ( File ➔ New ➔ Project )


Step 3:

Open New Project template Cross Platform ➔ Blank App(Xamarin .Forms .Portable)



*** Solution and project name is DevXamarinForms

Visual Studio automatically creates following projects,

DevXamarinForms.Android, DevXamarinForms.iOS, DevXamarinForms.UWP, etc and a shared Portable Class Library (PCL) project named called DevXamarinForms (Refer below)

After create project solution should be like below


Step 4:

Right Click on Portable Project (DevXamarinForms) ➔ Add ➔ New Item ➔Cross-Platform ➔ Forms Xaml Page and name it HomePage.CS



After that two new file are created under portable library HomePage.XAML and HomePage.XAML.cs

In HomePage.XAMl , the below code will automatically added into xaml page


<?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="DevXamarinForms.HomePage">
<Entry x:Name="txtresult" Text="welcome Devenvexe.com" /> <!--Add this TextBox-->
</ContentPage>

The xml two name space (xmls) are added into xaml page and refered xamarin and micrsoft url with version.

The HomePage.xaml.cs code-behind file looks like this.

using Xamarin.Forms;
namespace DevXamarinForms
{
public partial class HomePage : ContentPage
{
public HomePage()
{
InitializeComponent();
}
}
}

Where Can find InitializeComponent() Method :

InitializeComponent() method will generate during build so build your portable library , C# code file is generated from the XAML file. If you look in the \DevXamarinForms\DevXamarinForms\obj\Debug directory, you’ll find a file named DevXamarinForms.HomePage.xaml.g.cs. The ‘g’ stands for generated.



namespace DevXamarinForm {
using System;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
public partial class HomePage : global::Xamarin.Forms.ContentPage {
[System.CodeDom.Compiler.GeneratedCodeAttribute("Xamarin.Forms.Build.
Tasks.XamlG", "0.0.0.0")]
private global::Xamarin.Forms.Entry txtresult;
[System.CodeDom.Compiler.GeneratedCodeAttribute("Xamarin.Forms.Build.
Tasks.XamlG", "0.0.0.0")]

private void InitializeComponent() {
this.LoadFromXaml(typeof(HomePage));
txtresult = this.FindByName<global::Xamarin.Forms.Entry>("txtresult");
}
}
}

Just Modify App.CS file, like below

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Xamarin.Forms;
namespace DevXamarinForm
{
public class App : Application
{
public App()
{
// The root page of your application
//MainPage = new ContentPage
//{
// Content = new StackLayout
// {
// VerticalOptions = LayoutOptions.Center,
// Children = {
// new Label {
// HorizontalTextAlignment = TextAlignment.Center,
// Text = "Welcome to Xamarin Forms!"
// }
// }
// }
//};
MainPage = new HomePage(); // Add this code
}
}
}

Build and Run Application:










0 Comments

Featured Post

How to learn Azure without paid subscription

Microsoft Azure is a cloud service that is constantly expanding to help your organization meet business challenges. You can build, manage d...

Subscribe to the FREE Weekly Newsletter to receive all the latest Microsoft Azure, AI, Xamarin

Popular Posts