Get Started with DevExpress Bottom Sheet for .NET MAUI

• May 15, 2026
• 3 minutes to read

This topic explains how to integrate the BottomSheet component into a .NET MAUI cross-platform solution.

Watch Video: Get Started with the Bottom Sheet Control for .NET MAUI

Prerequisites

Refer to the following pages before you proceed with this Getting Started lesson:

• Microsoft .NET Multi-platform App UI documentation
• .NET MAUI and DevExpress Mobile UI Supported Platforms
• Requirements for .NET MAUI and DevExpress Mobile UI
• Get Started with DevExpress Controls for .NET Multi-platform App UI (.NET MAUI)

Create a New Project

Create a new .NET MAUI project in Visual Studio. If you use DevExpress project templates, note that this project already comes pre-configured with required NuGet packages, initialized components; and its XAML namespaces are declared on all predefined pages.

If you use the standard .NET MAUI project template, you should install the following NuGet packages:

• DevExpress.Maui.Controls — contains the BottomSheet component.

In the MauiProgram.cs file, call DevExpress.Maui.UseDevExpress and UseDevExpressControls methods to initialize the BottomSheet component.

C#

using DevExpress.Maui;
using DevExpress.Maui.Controls;

namespace mauiTemplate;

public static class MauiProgram {
    public static MauiApp CreateMauiApp() => MauiApp
        .CreateBuilder()
        .UseDevExpressControls()
        .UseMauiApp<App>()
        // This method adds handlers for all DevExpress components.
        .UseDevExpress()
        /* You can also use the code below to add the Bottom Sheet handler.
        .ConfigureMauiHandlers(handlers => {
            handlers.AddHandler<BottomSheet, BottomSheetHandler>();
        })
        */
        .Build();
}

See the following help topic for more information: Get Started with DevExpress Controls for .NET Multi-platform App UI (.NET MAUI).

Add a Bottom Sheet to the Main Page

The following example shows an action sheet when a user swipes up the page:

XAML

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:BottomSheetSample"
             xmlns:dx="http://schemas.devexpress.com/maui"
             x:Class="BottomSheetSample.MainPage" Shell.TabBarIsVisible="False">
    <ContentPage.Resources>
        <Style TargetType="dx:DXButton" x:Key="buttonStyle">
            <Setter Property="BackgroundColor" Value="{x:Null}" />
            <Setter Property="IconColor" Value="Gray" />
            <Setter Property="TextColor" Value="Gray" />
            <Setter Property="HorizontalContentAlignment" Value="Start"/>
        </Style>
    </ContentPage.Resources> 
    <VerticalStackLayout>
        <VerticalStackLayout.GestureRecognizers>
            <SwipeGestureRecognizer Direction="Up" Swiped="SwipeGestureRecognizer_Swiped"/>
        </VerticalStackLayout.GestureRecognizers>
        <dx:BottomSheet x:Name="bottomSheet"
                         CornerRadius="30"
                         BackgroundColor="White"
                         HalfExpandedRatio="0.3"
                         AllowDismiss="True"
                         ShowGrabber="True"
                         IsModal="True">
            <!--#region BottomSheetContent-->             
            <VerticalStackLayout Padding="4,20,4,4">
                <dx:DXButton Content="Share" Icon="share" Style="{x:StaticResource buttonStyle}" Clicked="Button_Clicked"/>
                <dx:DXButton Content="Get link" Icon="hyperlink" Style="{x:StaticResource buttonStyle}" Clicked="Button_Clicked"/>
                <dx:DXButton Content="Edit name" Icon="pencil" Style="{x:StaticResource buttonStyle}" Clicked="Button_Clicked"/>
            </VerticalStackLayout>
            <!--#endregion-->
        </dx:BottomSheet>
    </VerticalStackLayout>
</ContentPage>

C#

using DevExpress.Maui.Controls;
namespace BottomSheetSample;
public partial class MainPage : ContentPage {
    public MainPage() {
        InitializeComponent();
    }
    private void SwipeGestureRecognizer_Swiped(object sender, SwipedEventArgs e) {
        bottomSheet.State = BottomSheetState.HalfExpanded;
    }
    private void Button_Clicked(object sender, EventArgs e) {
        //...
    }
}

The following image shows the results:

Note: Errors may occur if you add a Button object to a Bottom Sheet. We recommend that you use a DXButton instead. Another option is a Label with a TapGestureRecognizer. See also: Java.Lang.IllegalArgumentException: The style on this component requires your app theme to be Theme.MaterialComponent