Getting Started with Xamarin.Forms

Welcome to the Xamarin.Forms getting started guide. This tutorial will walk you through the fundamental steps to create your first cross-platform mobile application using Xamarin.Forms.

What is Xamarin.Forms?

Xamarin.Forms is an open-source UI framework from Microsoft that allows you to build native UIs for Android, iOS, and Windows from a single, shared C# codebase. With Xamarin.Forms, you can develop a cross-platform application that has access to native APIs and features on each platform.

Prerequisites

Before you begin, ensure you have the following installed:

  • Visual Studio 2022 (with the .NET desktop development and mobile development with .NET workloads)
  • Android SDK
  • Xcode (for iOS development, requires a Mac)

You can download Visual Studio from here.

Step 1: Create a New Xamarin.Forms Project

Open Visual Studio and follow these steps:

  1. Click "Create a new project".
  2. Search for "Mobile App (Xamarin.Forms)".
  3. Select the template and click "Next".
  4. Give your project a name (e.g., MyFirstApp) and choose a location.
  5. Click "Create".
  6. In the "Create a new mobile app" dialog, choose the "Blank" template and select "XAML" for the User Interface.
  7. Click "Create".

Step 2: Explore the Project Structure

Your new project will have the following structure:

  • MyFirstApp (Core Project): This is where you'll write your shared C# and XAML code.
  • MyFirstApp.Android: The Android platform-specific project.
  • MyFirstApp.iOS: The iOS platform-specific project.
  • MyFirstApp.UWP: The Windows Universal Platform project (if selected).

Step 3: Write Your First XAML Page

Open the MainPage.xaml file in the core project. It will contain a basic XAML structure:

<?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="MyFirstApp.MainPage">

    <StackLayout HorizontalOptions="CenterAndExpand"
                 VerticalOptions="CenterAndExpand">

        <Label Text="Welcome to Xamarin.Forms!"
               HorizontalTextAlignment="Center"
               FontSize="Large" />

        <Button Text="Click Me!"
                Clicked="OnButtonClicked" />

    </StackLayout>

</ContentPage>

Step 4: Add Code-Behind Logic

Open the MainPage.xaml.cs file. This is where you'll handle events, like button clicks:

using System;
using Xamarin.Forms;

namespace MyFirstApp
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
        }

        void OnButtonClicked(object sender, EventArgs e)
        {
            // Display an alert when the button is clicked
            DisplayAlert("Button Clicked", "You clicked the button!", "OK");
        }
    }
}

Step 5: Run Your Application

Select your desired target platform (Android or iOS) from the Visual Studio toolbar and click the "Run" button. Visual Studio will build and deploy your application to the emulator or device.

Next Steps

Congratulations! You've created and run your first Xamarin.Forms application. Now you can explore more advanced topics: