MAUI AppShell切换页面后顶部出现蓝色栏的问题排查与解决

1. 蓝色栏是什么？ #

这个蓝色栏是Shell导航栏的残留背景，或是系统状态栏的默认背景色。当设置Shell.NavBarIsVisible="False"后，首次加载页面时Shell能正确隐藏导航栏，但页面切换时，Shell的导航状态未被正确同步重置，导致原本隐藏的导航栏背景（或系统状态栏背景）重新显示——这类状态不同步问题在Android平台尤为常见。

2. 彻底移除的解决方法 #

建议组合使用以下方案，确保彻底解决问题：

全局强制配置 #

在AppShell.xaml中添加全局Shell样式，让所有页面默认隐藏导航栏并设置透明背景：

<Shell.Resources>
    <Style TargetType="Shell">
        <Setter Property="NavBarIsVisible" Value="False" />
        <Setter Property="NavBarBackgroundColor" Value="Transparent" />
        <Setter Property="StatusBarColor" Value="Transparent" />
        <Setter Property="NavBarHasShadow" Value="False" />
    </Style>
</Shell.Resources>

页面级重置（确保切换后生效） #

在Names页面的后台代码中重写OnAppearing方法，每次页面显示时强制重置导航栏状态：

protected override void OnAppearing()
{
    base.OnAppearing();
    Shell.SetNavBarIsVisible(this, false);
    Shell.SetNavBarBackgroundColor(this, Colors.Transparent);
    Shell.SetStatusBarColor(this, Colors.Transparent);
}

平台特定修复（以Android为例） #

如果是Android平台的状态栏背景问题，在Platforms/Android/MainActivity.cs的OnCreate方法中添加系统级配置：

protected override void OnCreate(Bundle savedInstanceState)
{
    base.OnCreate(savedInstanceState);
    Window.SetStatusBarColor(Android.Graphics.Color.Transparent);
    Window.DecorView.SystemUiVisibility = Android.Views.StatusBarVisibility.LayoutFullscreen | Android.Views.StatusBarVisibility.LayoutStable;
}

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