You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何为MAUI Shell中MainPage以外的ContentPage添加Flyout菜单?

为Shell中的非MainPage页面添加Flyout菜单

你可以根据页面是否已在Shell的Flyout结构中,按以下方式配置Flyout菜单显示:

1. 已在FlyoutItem中定义的页面(如ProfilePage、BillingPage)

这类页面本身属于Shell的Flyout层级,但如果通过代码导航到这些页面时Flyout未自动显示,只需在目标页面的XAML根元素中添加Shell.FlyoutBehavior="Flyout"属性即可:

示例(ProfilePage.xaml):

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="YourApp.Views.ProfilePage"
             Shell.FlyoutBehavior="Flyout">
    <!-- 页面内容 -->
</ContentPage>

2. 未在FlyoutItem中定义的页面(如DetailsPage)

对于像DetailsPage这种通过GoToAsync导航的子页面,默认会隐藏Flyout,只需在页面XAML中显式开启Flyout行为:

示例(DetailsPage.xaml):

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="YourApp.Views.DetailsPage"
             Shell.FlyoutBehavior="Flyout">
    <!-- 页面内容 -->
</ContentPage>

补充说明

  • 若需要临时隐藏某页面的Flyout,可将属性值改为Shell.FlyoutBehavior="Disabled"(完全禁用Flyout)或"Locked"(Flyout不可拉出,但保留菜单图标)。
  • 对于需要通过代码导航的页面,建议在AppShell.xaml.cs中提前注册路由,确保导航逻辑正常:
Routing.RegisterRoute(nameof(DetailsPage), typeof(DetailsPage));

内容的提问来源于stack exchange,提问作者Kathy Judd

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.28 14:22:38