Mobile App Development in C# (.NET MAUI) - Textnotes

Mobile App Development in C# (.NET MAUI)

.NET MAUI (Multi-platform App UI) allows you to build cross-platform mobile and desktop apps using C# and XAML.

1. .NET MAUI Basics

  1. .NET MAUI = evolution of Xamarin.Forms
  2. Supports Android, iOS, Windows, macOS from a single codebase.
  3. Uses C# for logic and XAML for UI.
  4. Project structure includes:
  5. Platforms/ → platform-specific code
  6. App.xaml → global resources
  7. MainPage.xaml → main UI page

Create a new MAUI project:


dotnet new maui -n MyMauiApp
cd MyMauiApp
dotnet build

2. Creating Pages

Pages are screens in a MAUI app.

MainPage.xaml


<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
x:Class="MyMauiApp.MainPage"
Title="Home">
<StackLayout Padding="20">
<Label Text="Welcome to MAUI!" FontSize="24" HorizontalOptions="Center"/>
<Button Text="Go to Details" Clicked="Button_Clicked"/>
</StackLayout>
</ContentPage>

MainPage.xaml.cs


private async void Button_Clicked(object sender, EventArgs e)
{
await Navigation.PushAsync(new DetailsPage());
}

DetailsPage.xaml


<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
x:Class="MyMauiApp.DetailsPage"
Title="Details">
<StackLayout Padding="20">
<Label Text="This is the details page" FontSize="18"/>
</StackLayout>
</ContentPage>

3. Navigation

  1. Stack-based navigation with NavigationPage.
  2. Push new page:

await Navigation.PushAsync(new DetailsPage());
  1. Pop page:

await Navigation.PopAsync();

4. UI Controls

Common MAUI controls:

ControlDescription
LabelDisplay text
ButtonTrigger actions
EntryText input
PickerDropdown selection
CollectionViewDisplay lists/collections
ImageDisplay images

Example with Entry & Button


<Entry x:Name="txtName" Placeholder="Enter Name"/>
<Button Text="Greet" Clicked="Greet_Clicked"/>
<Label x:Name="lblMessage"/>

private void Greet_Clicked(object sender, EventArgs e)
{
lblMessage.Text = $"Hello {txtName.Text}!";
}

5. SQLite Local Database

  1. Use SQLite-net-pcl NuGet package for local storage.

dotnet add package SQLite-net-pcl

Model


public class Student
{
[PrimaryKey, AutoIncrement]
public int Id { get; set; }
public string Name { get; set; }
public int Age { get; set; }
}

Database Helper


using SQLite;

public class Database
{
private SQLiteConnection _db;

public Database(string dbPath)
{
_db = new SQLiteConnection(dbPath);
_db.CreateTable<Student>();
}

public List<Student> GetStudents() => _db.Table<Student>().ToList();
public void AddStudent(Student s) => _db.Insert(s);
}

Usage


var dbPath = Path.Combine(FileSystem.AppDataDirectory, "students.db3");
var database = new Database(dbPath);

database.AddStudent(new Student { Name = "John", Age = 20 });
var students = database.GetStudents();

6. API Integration

  1. Use HttpClient to consume REST APIs.

using System.Net.Http.Json;

HttpClient client = new HttpClient();
var students = await client.GetFromJsonAsync<List<Student>>("https://api.example.com/students");

foreach(var s in students)
{
Console.WriteLine($"{s.Name} - {s.Age}");
}
  1. Post data to API:

await client.PostAsJsonAsync("https://api.example.com/students", new Student { Name = "Alice", Age = 22 });

Summary of Chapter 16:

  1. .NET MAUI: Build cross-platform mobile apps with C# and XAML.
  2. Pages & Navigation: Manage app screens with NavigationPage.
  3. UI Controls: Build interactive UI using Entry, Button, Label, etc.
  4. SQLite: Store and retrieve data locally on mobile devices.
  5. API Integration: Consume REST APIs using HttpClient.