Tab Bar菜单返回时出现一闪而过的Flyout菜单Bug

在仅使用Tab Bar的MAUI应用中，从子页面执行返回操作时，Flyout菜单会短暂显示几帧。以下是相关代码及解决方案：

相关代码 #

MainViewModel.cs #

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;

namespace MauiApp1.ViewModel;
public partial class MainViewModel : ObservableObject
{
    [RelayCommand]
    async Task AddChat()
    {
        await Shell.Current.GoToAsync(nameof(NewChatPage));
    }
}

AppShell.xaml.cs #

namespace MauiApp1
{
    public partial class AppShell : Shell
    {
        public AppShell()
        {
            InitializeComponent();
            Routing.RegisterRoute(nameof(NewChatPage), typeof(NewChatPage));
        }
    }
}

MauiProgram.cs #

namespace MauiApp1.Other
{
    public static class MauiProgram
    {
        public static MauiApp CreateMauiApp()
        {
            var builder = MauiApp.CreateBuilder();
            builder
                .UseMauiApp<App>()
                .ConfigureFonts(fonts =>
                {
                    fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
                    fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                    fonts.AddFont("Helvetica-Bold.ttf", "Helveticabold");
                });

#if DEBUG
            builder.Logging.AddDebug();
#endif
            builder.Services.AddSingleton<MainPage>();
            builder.Services.AddSingleton<MainViewModel>();

            builder.Services.AddSingleton<NewChatPage>();
            builder.Services.AddSingleton<NewChatViewModel>();
            return builder.Build();
        }
    }
}

解决方案 #

这个问题大概率是Shell默认启用Flyout功能导致的——即使未定义Flyout菜单，返回操作仍可能触发Flyout的显示逻辑。解决方法是在AppShell.xaml中显式禁用Flyout行为：

<Shell xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
       x:Class="MauiApp1.AppShell"
       FlyoutBehavior="Disabled">
    <!-- 原有的TabBar定义 -->
    <TabBar>
        <!-- 你的Tab项 -->
    </TabBar>
</Shell>

设置FlyoutBehavior="Disabled"后，会完全禁用Shell的Flyout交互和显示逻辑，返回时就不会再出现Flyout菜单短暂闪现的问题。

如果上述方法无效，还可以尝试自定义页面的返回逻辑，在NewChatPage中重写返回事件，直接导航回Tab Bar页面而不使用Shell的默认返回：

protected override bool OnBackButtonPressed()
{
    Shell.Current.GoToAsync("..");
    return true;
}

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