Introduction
Xamarin permet de développer des applications mobiles natives pour iOS et Android en utilisant C# et .NET. Cette approche réduit les coûts de maintenance grâce au partage de code. En 2026, Xamarin.Forms reste pertinent pour les projets intermédiaires nécessitant une UI déclarative. Ce tutoriel vous guide pas à pas vers une application fonctionnelle avec navigation et liaison de données.
Prérequis
- Visual Studio 2022 avec workloads Xamarin
- .NET 6+ et Xamarin.Forms 5.x
- Connaissances de base en C# et XAML
- Compte développeur Apple et Android SDK configuré
Création du projet
dotnet new Xamarin.Forms -n MonAppMobile
cd MonAppMobile
dotnet restoreCette commande initialise un projet Xamarin.Forms multiplateforme avec les dossiers Shared, Android et iOS. Le restore télécharge les dépendances NuGet essentielles comme Xamarin.Essentials.
Configuration App.xaml
<?xml version="1.0" encoding="utf-8" ?>
<Application xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="MonAppMobile.App">
<Application.Resources>
<ResourceDictionary>
<Style TargetType="Button">
<Setter Property="BackgroundColor" Value="#2196F3" />
</Style>
</ResourceDictionary>
</Application.Resources>
</Application>App.xaml définit les ressources globales. Le style appliqué aux boutons assure une cohérence visuelle sur toutes les plateformes sans duplication de code.
Page principale en XAML
<?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="MonAppMobile.MainPage">
<StackLayout Padding="20">
<Entry x:Name="NomEntry" Placeholder="Votre nom" />
<Button Text="Valider" Clicked="OnValiderClicked" />
<Label x:Name="ResultLabel" FontSize="20" />
</StackLayout>
</ContentPage>Ce fichier XAML crée une interface simple avec champ de saisie et bouton. Les noms permettent la référence depuis le code-behind pour la liaison des événements.
Logique C# de la page
using Xamarin.Forms;
namespace MonAppMobile
{
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
}
private void OnValiderClicked(object sender, EventArgs e)
{
string nom = NomEntry.Text;
ResultLabel.Text = $"Bonjour {nom} !";
}
}
}Le code-behind gère l'événement du bouton et met à jour le label. Cette séparation XAML/C# facilite la maintenance et les tests unitaires.
Modèle de données
namespace MonAppMobile.Models
{
public class Utilisateur
{
public string Nom { get; set; }
public int Age { get; set; }
}
}Ce modèle POCO sera utilisé pour la liaison de données. Il respecte les conventions de nommage pour un binding automatique dans les ListView.
Binding et ViewModel
using System.ComponentModel;
using Xamarin.Forms;
namespace MonAppMobile.ViewModels
{
public class MainViewModel : INotifyPropertyChanged
{
private string _nom;
public string Nom
{
get => _nom;
set { _nom = value; OnPropertyChanged(); }
}
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged([System.Runtime.CompilerServices.CallerMemberName] string propertyName = null)
=> PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}Le ViewModel implémente INotifyPropertyChanged pour une liaison réactive. Cela permet à l'UI de se mettre à jour automatiquement sans code manuel.
Bonnes pratiques
- Utilisez MVVM pour séparer la logique métier de l'UI
- Gérez les permissions avec Xamarin.Essentials
- Testez sur les émulateurs Android et simulateurs iOS
- Optimisez les images avec FFImageLoading
- Mettez à jour régulièrement les packages NuGet
Erreurs courantes
- Oublier InitializeComponent() dans le constructeur
- Ne pas implémenter INotifyPropertyChanged correctement
- Ignorer les différences de rendu entre iOS et Android
- Utiliser des appels bloquants sur le thread UI
Pour aller plus loin
Approfondissez Xamarin avec nos modules avancés sur la navigation Shell et l'intégration d'API REST. Découvrez nos formations Learni.