Introduction

Completed

.NET MAUI lets you create an app's user interface dynamically by using C# code. However, sometimes it's more appropriate and efficient to define the UI statically. Extensible Application Markup Language (XAML) provides a way to lay out the UI at compile time. The XAML description of the UI also provides a degree of documentation, allowing you to quickly grasp the way in which the UI is presented to a user without having to delve through the application code.

Suppose you work for a power utility company as a mobile developer. You're responsible for improving the company's mobile app that engineers use when visiting customer premises. Currently, the app's UI is built using C# code. However, you've started to notice it's becoming more difficult to manage UI updates. This difficulty is due to the app getting more complex. It's becoming increasingly hard to understand the core behavior logic, because it's mixed in with UI code.

You want to find a solution that will introduce clean separation of UI and behavior. Separating UI and behavior allows your design expert to focus on what they do best, and you'll have time to focus on coding the app's behavior. .NET MAUI lets you define your UI using XAML. XAML gives you a clean separation of user interface (UI) and behavior. XAML also makes it easier to use a design expert and design tools. In this module, you'll learn how to create a .NET MAUI app that defines its pages and controls using XAML instead of C# code. Creating the UI on XAML allows you to separate all your UI code from your behavior code to make it easier to manage both.

Learning objectives

In this module, you'll learn:

  • The benefits of using XAML over defining the UI for a .NET MAUI app in C#.
  • How to create pages and controls, and set their properties using XAML.
  • How to handle UI events and wire them up in XAML.
  • How to create and use XAML markup extensions.
  • How to set platform-specific values in XAML markup.

Prerequisites

  • Visual Studio 2022 with the .NET MAUI workload installed
  • Optional: Visual Studio Code with the .NET MAUI Extension and .NET SDK with the .NET MAUI workload installed
  • Familiarity with C# and .NET

Requirements for .NET MAUI development

To create .NET MAUI apps with .NET 9, you need to install Visual Studio version 17.12 or newer with the following workload installed:

  • .NET Multi-Platform App UI development

Additionally, if you want to build .NET MAUI Blazor apps, you must install the ASP.NET and web development workload.

See the documentation for a walkthrough of setup.

Development with Visual Studio Code

If you're developing on macOS or Linux, you'll need to install Visual Studio Code and the .NET MAUI Extension along with the .NET SDK and .NET MAUI Workload. See the documentation for a walkthrough of setup.