.NET MAUI flyout as a regular sidebar-CodePudding

By default .NET MAUI shows its flyout as a hamburger menu. Is there a way to show it as a regular sidebar that is always open and doesn't overlap the content?

CodePudding user response：

On Windows you can say

Shell.FlyoutBehavior="Locked"

I don't know what that does on mobile, though.

CodePudding user response：

You can put the following code into your AppShell.xaml and it will work.

<Shell.Resources>
        <ResourceDictionary>
            <Style x:Key="BaseStyle" TargetType="Element">   
                <Setter Property="Shell.FlyoutBehavior" Value="Locked"></Setter>
                <Setter Property="Shell.FlyoutWidth" Value="55"></Setter>              
            </Style>

            <Style TargetType="TabBar" BasedOn="{StaticResource BaseStyle}" />
            <Style TargetType="FlyoutItem" BasedOn="{StaticResource BaseStyle}" />
            
        </ResourceDictionary>
</Shell.Resources>

Here is the sample: