Xamarin Guide 1: Create a Xamarin Forms Project

Scope

This Xamarin Workshop Guide was created for the The Portuguese National Meeting of IT Students (ENEI) by Sara Silva and the original content is available here. To extend it to the global community, it was published in a new project called Xam Community Workshop that the main goal is for any developer or user group to customize it for their events.

Create a Xamarin Forms project

The application you will create is a Xamarin Forms application, based on a Portable Class Library project.

• Using Xamarin Studio in Mac

Start by opening the Xamarin Studio as described in Figure 1.



Then create a new Blank App (Xamarin Forms Portable), as in the following.



And the result will be something as described in Figure 3.



The ENEI.SessionApp solution is defined by the following three projects.

• ENEI.SessionsApp Portable Class Library project that will contain the shared code between targets. This project is independent of the platform.
  
  
• ENEI.SessionsAp Droid: Xamarin Android project that defines the Android application and knows the Android API.
  
  
• ENEI.SessionsApp.iOS Xamarin iOS project that defines the iOS application and knows the iOS API.

Now, you should update the Nuget Packages available in the project. In the case described in Figure 4, you only need to update the Xamarin Forms Nuget Package.

 

To update this package you only need to open the context menu, do a right-click to open the context menu and then click “Update”, as described in Figure 5:



The result will be:



You need to do the same in the others projects, if needed.

Before running the application, you should select the solution and define the configurations, as in the following.



Wowwww, now you are ready to create your 1010 ENEI Session app!

• Using Xamarin Studio in Windows

Start by opening the Xamarin Studio as described in figure 8:



Then create a new Blank App (Xamarin Forms Portable), as described in the following figure:



The result will be something as described in Figure 10:



The ENEI.SessionApp solution is defined by the following two projects:

• ENEI.SessionsApp: Portable Class Library project that will contain the shared code between targets. This project is independent of the platform.
• ENEI.SessionsApp.Droid: Xamarin Android project that defines the Android application and knows the Android API.

You should now update the Nuget Packages available in the project. In the case described in Figure 11, you only need to update the Xamarin Forms Nuget package and the Xamarin.Android.Support.v4 Nuget package:



To update this package you only need to open the context menu, doing a right-click with the mouse and then click “Update”, as described in Figure 12:



The result will be:



You need to do the same in the other project, if needed.

Wowwww, now you are ready to create your 1010 ENEI Session app!

• Using Visual Studio in Windows

Start by opening the Visual Studio as described in Figure 14.



And then create a new Blank App (Xamarin Forms Portable), as in the following:



And the result will be something as described in Figure 16:



The ENEI.SessionApp solution is defined by the following four projects:

• ENEI.SessionsApp: Portable Class Library project that will contain the shared code between targets. This project is independent of the platform.
  
  
• ENEI.SessionsApp.Droid: Xamarin Android project that defines the Android application and knows the Android API.
  
  
• ENEI.SessionsApp.iOS: Xamarin iOS project that defines the iOS application and knows the iOS API.
  
  
• ENEI.SessionsApp.WinPhone: Windows Phone project that defines the Windows Phone application and knows the Windows Phone API;

You should now update the Nuget Packages available in the project. In this case you only need to update the Xamarin Forms Nuget Package, as described in Figure 17 and Figure 18:





The result will be:



You need to do the same in the others project, if needed.

Before running the application, you should select the solution and define the build and deploy apps, as in the following:



Wowwww you ready to create your 1010 ENEI app!

• Running the application

Depending on the scenario, you will have more or less platforms covered, here is an overview:

• Using Xamarin Studio in a Mac: Android + iOS Apps
• Using Xamarin Studio in Windows: Android Apps
• Using Visual Studio without Xamarin plugin: Windows Apps
• Using Visual Studio with Xamarin plugin: Windows, Android and iOS (*) apps,

(*) Is required a Xamarin Build Host in a Mac connect to Visual Studio.

In Figure 21, it is possible to see the Android, iOS and Windows Phone applications running at the same time. The Android app is running in Xamarin Android Player, the iOS app is running in the iPhone Simulator and the Windows Phone application is running in a Lumia 1020 device (that is connected to a Windows system running in a Parallels, in a Mac).

• Additional notes: Xamarin Forms initialization

Each developer should understand how a Xamarin Forms app is defined. This way, developers should know:

In ENEI.SessionsApp.iOS app, more specific in AppDelegate.cs has the following code:

 

public override bool FinishedLaunching(UIApplication app, NSDictionary options)
{
   global::Xamarin.Forms.Forms.Init();
   LoadApplication(new App());
   return base.FinishedLaunching(app, options);
}

That initializes the Xamarin Forms and defines what class has the start point for the Xamarin Forms App that defines the main page created with the Xamarin Forms API.

The same happens in ENEI.Sessions.Android app, more specific in MainActivity.cs:

 

protected override void OnCreate(Bundle bundle)
{
   base.OnCreate(bundle);
   global::Xamarin.Forms.Forms.Init(this, bundle);
   LoadApplication(new App());
}

And in the ENEI.Sessions.WinPhone app, more specificaly in the MainPage.xaml.cs:

 

public MainPage()
{
   InitializeComponent();
   SupportedOrientations = SupportedPageOrientation.PortraitOrLandscape;
   global::Xamarin.Forms.Forms.Init();
   LoadApplication(new ENEI.SessionsApp.App());
}

 At this moment, the App.cs defined in ENEI.SessionsApp (Portable Class Library) is defined by:

 

public class App: Application
{
    public App()
    {
        // The root page of your application
        MainPage = new ContentPage
        {
            Content = new StackLayout
            {
                VerticalOptions = LayoutOptions.Center,
                Children = {
                    new Label {
                        XAlign = TextAlignment.Center,
                        Text = "Welcome to Xamarin Forms!"
                    }
                }
            }
        };
    }
}

As said early, the ENEI.SessionsApp will be the project that will have the shared code between targets and it is independent of the platform. In this way, in this project you will define the Model, the Views, the data source and other useful classes that can be reused between platforms.