FlyoutItem is displayed on top and on side-CodePudding

I have a .NET Maui project with a simple side-navigation in it. In my Shell, I have a Flyoutitem with multiple ShellContent in them with different links. This is my shell:

<?xml version="1.0" encoding="UTF-8" ?>
<Shell
    x:Class="JamIT.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:JamIT"
    xmlns:views="clr-namespace:Jam_It_.Views"
    Shell.FlyoutBehavior="Locked"
    FlyoutWidth="275"
    FlyoutHeaderBehavior="CollapseOnScroll"
    Shell.NavBarIsVisible="False">

    <FlyoutItem FlyoutDisplayOptions="AsMultipleItems">
        <ShellContent ContentTemplate="{DataTemplate local:MainPage}" Title="Home" Icon="home_icon.png"/>

        <ShellContent Title="Discover"  Icon="search_icon.png"/>


        <ShellContent ContentTemplate="{DataTemplate views:AddUpdateAlbumDetail}" Title="Create Album"  
                      Icon="plus_icon.png" Route="AlbumsOverview" />

        <ShellContent ContentTemplate="{DataTemplate views:AddUpdateSongDetail}" Title="Upload Song"
                       Icon="plus_icon.png" Route="SongOverview"/>

    </FlyoutItem>


    <ShellContent Title="Hello World" />



</Shell>

The navbar is on the left side, but still it is also displayed on top. Here is a picture:

I just want the bar on the left, the Flyoutitems should not be on the top aswell. How can I remove them?

Thank you

CodePudding user response：

You could try the following code:

<Shell
    x:Class="JamIT.AppShell"
    ...
    Shell.TabBarIsVisible="False">

(you can also add Shell.TabBarIsVisible="False" to the shell content).

For more info, you could refer to TabBar and Tab visibility

Hope it works for you.