.NET MAUI如何仅在指定页面设置Flyout菜单

核心原因 #

你把Login和MainPage都直接作为Shell的顶级ShellContent，导致导航到MainPage时它处于Login的导航栈中，系统只会显示返回箭头而非Flyout菜单。Flyout菜单仅当页面属于FlyoutItem层级，且是导航栈的根页面时才会显示。

修复步骤 #

1. 调整AppShell结构 #

把MainPage放到一个FlyoutItem中，同时保持Login作为独立的顶级ShellContent（用于启动页）：

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

    <!-- 登录页作为启动页，禁用Flyout -->
    <ShellContent
        Shell.FlyoutBehavior="Disabled"
        Title="Login"
        ContentTemplate="{DataTemplate local:Login}"
        Route="Login" />

    <!-- 主页及其他Flyout项 -->
    <FlyoutItem Title="Početna" Icon="home.png">
        <ShellContent
            Title="Početna"
            ContentTemplate="{DataTemplate local:MainPage}"
            Route="MainPage"/>
    </FlyoutItem>

    <FlyoutItem Title="Predjelo" Icon="breakfast.png">
       <ShellContent ContentTemplate="{DataTemplate local:Breakfast}"/>
    </FlyoutItem>
    <FlyoutItem Title="Glavno jelo" Icon="food.png">
        <ShellContent ContentTemplate="{DataTemplate local:Lunch}"/>
    </FlyoutItem>
    <FlyoutItem Title="Desert" Icon="dinner.png">
         <ShellContent ContentTemplate="{DataTemplate local:Dinner}"/>
    </FlyoutItem>
    <FlyoutItem Title="Meni" Icon="dinner.png">
        <ShellContent ContentTemplate="{DataTemplate local:ListaJela}"/>
    </FlyoutItem>
</Shell>

2. 修改登录后的导航方式 #

登录成功后，使用替换导航栈的方式跳转到MainPage，让它成为根页面：

// 登录按钮点击事件中
await Shell.Current.GoToAsync("//MainPage", true);

第二个参数true表示清除导航栈，这样MainPage就会成为栈的根，系统会显示Flyout菜单而非返回箭头。

3. 修复拼写错误 #

你最后一个FlyoutItem里的DataTemplatelocal:ListaJela少了空格，应该是DataTemplate local:ListaJela，这个错误会导致页面无法加载，顺便修正。

内容的提问来源于stack exchange，提问作者edodoe