MSDN

Understanding MAUI Project Structure

A well-organized project structure is crucial for developing robust and maintainable cross-platform applications with .NET MAUI. This tutorial will guide you through the typical folders and files you'll encounter in a new MAUI project.

Core Project Folders

When you create a new .NET MAUI project, Visual Studio or the .NET CLI generates a set of essential folders, each serving a specific purpose:

• Platforms: This is the heart of your cross-platform development. Inside this folder, you'll find subfolders for each target platform (e.g., android, ios, maccatalyst, windows). Each platform-specific folder contains project files and resources tailored to that operating system.
• Resources: This directory houses all your application's assets. It's further divided into:
  • Fonts: For custom font files.
  • Images: For static images used in your app.
  • Styles: For defining application-wide visual styles.
  • AppIcon.png, MauiIcon.svg, etc.: Platform-specific icons.
• App.xaml and App.xaml.cs: These files represent the entry point of your MAUI application. App.xaml defines the application's resources and initial structure, while App.xaml.cs contains the application's code-behind logic, including initialization and handling of application lifecycle events.
• AppShell.xaml and AppShell.xaml.cs: The AppShell acts as the main structure or skeleton of your application. It's where you define the overall navigation experience, such as flyouts (hamburger menus) and tabs. It often references the different pages of your app.
• Pages: Typically, you'll create your UI pages within the root directory or a dedicated Pages folder. Each page usually consists of an XAML file for the UI definition and a C# file for its code-behind logic.
• ViewModels: Following the MVVM (Model-View-ViewModel) pattern, this folder (or a similar structure) would contain your ViewModel classes, which handle the business logic and data for your Views (Pages).
• Models: This folder would contain your data models, representing the structure of the data your application works with.

Example Project Structure

Here's a visual representation of a common MAUI project structure:

.
├── App.xaml
├── App.xaml.cs
├── AppShell.xaml
├── AppShell.xaml.cs
├── MauiProgram.cs
├── Platforms
│   ├── Android
│   │   ├── MainActivity.cs
│   │   ├── Resources
│   │   │   ├── drawable
│   │   │   ├── mipmap
│   │   │   └── values
│   │   └── ...
│   ├── iOS
│   │   ├── AppDelegate.cs
│   │   └── ...
│   ├── MacCatalyst
│   │   ├── AppDelegate.cs
│   │   └── ...
│   └── Windows
│       ├── MainWindow.xaml
│       ├── MainWindow.xaml.cs
│       └── ...
├── Resources
│   ├── Fonts
│   ├── Images
│   │   ├── dotnet_bot.svg
│   │   └── ...
│   ├── Styles
│   │   └── colors.xaml
│   └── AppIcon.png
├── Views
│   ├── LoginPage.xaml
│   ├── LoginPage.xaml.cs
│   └── ...
├── ViewModels
│   ├── LoginViewModel.cs
│   └── ...
├── Models
│   ├── User.cs
│   └── ...
├── App.csproj
└── ...

MauiProgram.cs

The MauiProgram.cs file is the application's bootstrap file. It's where you configure your MAUI app, register services (like dependency injection), and set up handlers and other customizations.

// MauiProgram.cs
using Microsoft.Maui.Controls.Hosting;
using Microsoft.Maui.Hosting;

public class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder
            .UseMauiApp()
            .ConfigureFonts(fonts =>
            {
                fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
                fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
            })
            .ConfigureServices(); // Example of configuring services

        // Register custom controls or handlers here

        return builder.Build();
    }

    private static MauiAppBuilder ConfigureServices(this MauiAppBuilder builder)
    {
        // Example: Registering a ViewModel
        // builder.Services.AddTransient();
        return builder;
    }
}

Key Files Explained

• App.csproj: The project file that defines your .NET MAUI project, its dependencies, and build configurations.
• dotnet_bot.svg: A sample SVG image often included in new MAUI projects, demonstrating image usage.
• XAML Files: Used for defining the UI structure and layout of your pages and controls.
• C# Code-Behind Files: Contain the logic, event handlers, and data binding for your XAML UI.

Understanding these components will help you navigate your MAUI projects efficiently and build powerful cross-platform applications with confidence.