.NET MAUI项目FlyoutItem同时显示侧边与顶部，如何移除顶部显示？

你遇到的问题是因为使用FlyoutDisplayOptions="AsMultipleItems"时，Shell默认会将FlyoutItem下的ShellContent同时渲染为顶部TabBar项。要只保留左侧侧边栏，隐藏顶部的TabBar显示，只需添加一个属性即可：

解决步骤 #

• 在你的FlyoutItem标签上添加Shell.TabBarIsVisible="False"，明确指定该FlyoutItem下的内容不显示在顶部TabBar中。

修改后的完整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" Shell.TabBarIsVisible="False">
        <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>    

补充说明 #

• Shell.NavBarIsVisible="False"是隐藏顶部的导航栏（包含标题、返回按钮等），而Shell.TabBarIsVisible="False"是专门控制TabBar的可见性，两者作用不同。
• 如果你希望全局隐藏所有TabBar，也可以直接在Shell根标签上添加Shell.TabBarIsVisible="False"，但针对FlyoutItem单独设置更精准，避免影响其他可能需要TabBar的场景。

内容的提问来源于stack exchange，提问作者Ilian Gion Häsler