Introduction to .NET MAUI UI Controls
.NET Multi-platform App UI (.NET MAUI) provides a comprehensive set of UI controls that enable you to build modern, native, cross-platform applications from a single shared codebase. These controls abstract away platform-specific UI elements, allowing you to focus on your application logic and design.
Whether you need basic input fields, complex layout containers, or interactive elements, .NET MAUI has you covered. This page serves as a guide to the most commonly used UI controls and their capabilities.
Core UI Controls
Layouts
Arrange your UI elements effectively with powerful layout containers.
VerticalStackLayoutHorizontalStackLayoutGridFlexLayoutScrollView
Basic Controls
Essential elements for user interaction and information display.
LabelButtonEntryEditorCheckBoxSwitchSlider
Images and Media
Incorporate visual content and multimedia into your applications.
ImageImageButtonMediaElement
Lists and Collections
Display and interact with collections of data efficiently.
CollectionViewListView(for simpler scenarios)CarouselView
Navigation
Enable seamless navigation between different parts of your app.
NavigationPageTabbedPageFlyoutPage(Hamburger Menu)
Input & Selection
Provide users with various ways to input data and make choices.
DatePickerTimePickerPicker(Dropdown)StepperRadioButton
Advanced Controls and Concepts
Custom Controls
For unique UI requirements, .NET MAUI allows you to create your own custom controls by extending existing ones or building them from scratch. This empowers you to achieve pixel-perfect designs and specialized functionality.
You can leverage the power of XAML and C# to define the visual tree and behavior of your custom controls.
Tip: Consider using Shell for built-in navigation and app structure simplification.
Styling and Appearance
.NET MAUI offers robust styling capabilities. You can define styles in XAML to ensure a consistent look and feel across your application. This includes setting properties for colors, fonts, padding, margins, and more.
Use ResourceDictionary to manage your styles efficiently and apply them to multiple controls.
<Style TargetType="Button">
<Setter Property="BackgroundColor" Value="{DynamicResource PrimaryColor}" />
<Setter Property="TextColor" Value="White" />
<Setter Property="CornerRadius" Value="5" />
</Style>
Community Resources and Examples
The .NET MAUI community is a vibrant source of knowledge and inspiration. Explore the following resources to find practical examples, tutorials, and discussions: