MAUI Controls

.NET Multi-platform App UI (.NET MAUI) provides a comprehensive set of built-in controls that enable you to build rich user interfaces for desktop and mobile applications from a single, shared codebase. These controls are rendered natively on each platform, ensuring a consistent look and feel and optimal performance.

Core Controls

Label

The Label control is used to display text. It supports basic text formatting, multiple lines, and character spacing.

Label Example

Hello, .NET MAUI!

Basic usage in XAML:


<Label Text="Hello, .NET MAUI!"
       FontSize="20"
       TextColor="{StaticResource PrimaryColor}" />

Button

The Button control is used to trigger an action when tapped. It can display text or an image.

Button Example

Basic usage in XAML:


<Button Text="Click Me"
        BackgroundColor="{StaticResource PrimaryColor}"
        TextColor="White"
        Clicked="OnButtonClicked" />

Entry

The Entry control allows users to input single-line text. It supports placeholder text and keyboard type customization.

Entry Example

Basic usage in XAML:


<Entry Placeholder="Enter your name" />

Editor

The Editor control allows users to input multi-line text. Similar to Entry, it supports placeholder text.

Editor Example

Basic usage in XAML:


<Editor Placeholder="Enter your message"
        HeightRequest="150" />

Image

The Image control displays an image from various sources, including local files, URIs, and embedded resources.

Image Example

Basic usage in XAML:


<Image Source="dotnet_bot.png" />

Layout Controls

StackLayout

StackLayout arranges child elements in a one-dimensional line, either horizontally or vertically.


<StackLayout Orientation="Vertical" Spacing="10">
    <Label Text="Item 1" />
    <Label Text="Item 2" />
    <Label Text="Item 3" />
</StackLayout>

Grid

Grid arranges child elements in rows and columns, providing powerful layout capabilities.


<Grid RowDefinitions="Auto,*"
      ColumnDefinitions="*,*"
      RowSpacing="5"
      ColumnSpacing="5">
    <Label Grid.Row="0" Grid.Column="0" Text="Header 1" />
    <Label Grid.Row="0" Grid.Column="1" Text="Header 2" />
    <BoxView Grid.Row="1" Grid.Column="0" Color="LightBlue" />
    <BoxView Grid.Row="1" Grid.Column="1" Color="LightGreen" />
</Grid>

More Controls

.NET MAUI also offers a wide range of other controls for specific purposes, including:

CollectionView: For displaying lists and grids of data.
ListView: A more traditional list view control.
ScrollView: Enables scrolling content that exceeds the available screen space.
Slider: A control for selecting a numeric value within a range.
Switch: A toggle switch for boolean values.
DatePicker, TimePicker: For selecting dates and times.
CarouselView: For swipeable views.
And many more...

Explore the full list of .NET MAUI controls and their detailed documentation on Microsoft Learn to build robust and engaging cross-platform applications.