升级MAUI/Blazor混合应用后iOS端出现顶部栏，如何移除？

你看到的顶部带中间按钮的栏是iOS 18新增的Window Controls Overlay（窗口控制覆盖栏），MAUI 8.0.90版本默认在iOS平台启用了该特性，用于适配iPadOS/iOS的窗口化交互逻辑，但在全屏运行的应用中会导致页面内容被向下挤压。

以下是几种移除或适配该栏的方法：

1. 全局禁用窗口控制栏 #

在iOS平台的AppDelegate.cs文件的FinishedLaunching方法中添加代码，全局关闭该特性：

using Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;

public override bool FinishedLaunching(UIApplication app, NSDictionary options)
{
    // 其他初始化代码...
    Application.SetWindowControlsOverlayStyle(this, WindowControlsOverlayStyle.Hidden);
    return base.FinishedLaunching(app, options);
}

2. 针对单个页面禁用 #

如果不需要全局禁用，可在特定页面的代码后台中添加配置：

using Microsoft.Maui.Controls.PlatformConfiguration;
using Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;

public YourPage()
{
    InitializeComponent();
    // 禁用当前页面的窗口控制栏
    this.On<iOS>().SetWindowControlsOverlayStyle(WindowControlsOverlayStyle.Hidden);
}

3. 适配布局（保留栏但避免内容挤压） #

若需要保留该栏，可通过调整布局避免内容被挤压：

• 在Blazor的全局样式文件（如wwwroot/css/app.css）中添加顶部内边距：

body {
    padding-top: env(window-controls-overlay-height, 0);
}

• 或在MAUI页面中启用自动适配边距：

this.On<iOS>().SetUseWindowControlsOverlayMargin(true);

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