NET MAUI FlyoutItem need to be dragged from left to right to be visible

Question

This is my AppShell XAML file (not sure this is right):

<?xml version="1.0" encoding="UTF-8" ?>
<Shell
    x:Class="MauiUI.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:MauiUI"
    xmlns:pages="clr-namespace:MauiUI.Pages"
    FlyoutHeaderBehavior="CollapseOnScroll"
    FlyoutBackdrop="Silver">
    
    <FlyoutItem Title="Amazons of Volleyball">
        <ShellContent Title="Amazons of Volleyball"
                      Route="home" 
                      ContentTemplate="{DataTemplate pages:MainPage}" />
    </FlyoutItem>
    
    <FlyoutItem Title="Add new Amazon">
        <ShellContent Title="Add new Amazon"
                      Route="add-or-update" 
                      ContentTemplate="{DataTemplate pages:AddOrUpdatePlayer}" />
    </FlyoutItem>
    
    <ShellContent Title="Amazons of Volleyball"
                  IsVisible="False"
                  ContentTemplate="{DataTemplate pages:SplashPage}"
                  Route="splash" />
</Shell>

Now the hamburger menu is appearing, but to see the content I had to drag over it my mouse and pull from left to right it to appear. I am on Android emulator in windows.

`Shell.FlyoutBehavior="Flyout"` the code will create a button at the head of the application. When you click the button then the menu will flyout. — Guangyu Bai - MSFT, Feb 15 '23 at 01:43

score 0 · Answer 1 · answered Feb 06 '23 at 03:29

You can add Shell.FlyoutBehavior="Flyout" to your AppShell.

Here is the example:

<Shell
    x:Class="MauiApp15.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:MauiApp15"
    Shell.FlyoutBehavior="Flyout"
    >

NET MAUI FlyoutItem need to be dragged from left to right to be visible

1 Answers1