Swipe Gesture in .NET MAUI Navigation Drawer (SfNavigationDrawer)

21 May 20251 minute to read

The Navigation Drawer supports swipe gesture for both opening and closing the drawer.

Enabling swipe gesture

The EnableSwipeGesture property can activate or deactivate the swipe functionality in the SfNavigationDrawer.

XAML

<navigationdrawer:SfNavigationDrawer x:Name="navigationDrawer">
    <navigationdrawer:SfNavigationDrawer.DrawerSettings>
        <navigationdrawer:DrawerSettings EnableSwipeGesture="True">
        </navigationdrawer:DrawerSettings>
    </navigationdrawer:SfNavigationDrawer.DrawerSettings>
</navigationdrawer:SfNavigationDrawer>

C#

SfNavigationDrawer navigationDrawer = new SfNavigationDrawer();
DrawerSettings drawerSettings = new DrawerSettings()
{
    EnableSwipeGesture= true,
};
navigationDrawer.DrawerSettings = drawerSettings;
this.Content = navigationDrawer;

Swipe sensitivity

The TouchThreshold property in the SfNavigationDrawer can expand the swipe region. The default value of TouchThreshold is 120.

XAML

<navigationdrawer:SfNavigationDrawer x:Name="navigationDrawer">
    <navigationdrawer:SfNavigationDrawer.DrawerSettings>
        <navigationdrawer:DrawerSettings TouchThreshold="200">
        </navigationdrawer:DrawerSettings>
    </navigationdrawer:SfNavigationDrawer.DrawerSettings>
</navigationdrawer:SfNavigationDrawer>

C#

SfNavigationDrawer navigationDrawer = new SfNavigationDrawer();
DrawerSettings drawerSettings = new DrawerSettings()
{
    TouchThreshold = 200,
};
navigationDrawer.DrawerSettings = drawerSettings;
this.Content = navigationDrawer;