如何移除WinUI自定义标题栏的灰色覆盖层？

在WinUI应用中自定义标题栏时，启用ExtendsContentIntoTitleBar=true并指定自定义标题栏元素后，若标题栏出现灰色覆盖层，可通过以下步骤解决：

核心解决方案：移除系统默认标题栏背景层 #

WinUI默认会保留标题栏的系统背景，即使设置了自定义标题栏也不会自动隐藏。需通过AppWindowTitleBar显式将相关背景设为透明：

1. 添加C#代码修改标题栏背景属性：

using Microsoft.UI.Windowing;
using Microsoft.UI.Xaml.Interop;
using Windows.Win32;
using Windows.Win32.Foundation;

// 获取当前窗口的AppWindow
var appWindow = GetAppWindowForCurrentWindow();
if (appWindow != null)
{
    var titleBar = appWindow.TitleBar;
    // 设置标题栏及按钮的背景为透明
    titleBar.BackgroundColor = Colors.Transparent;
    titleBar.InactiveBackgroundColor = Colors.Transparent;
    titleBar.ButtonBackgroundColor = Colors.Transparent;
    titleBar.ButtonInactiveBackgroundColor = Colors.Transparent;
}

// 实现获取AppWindow的方法
private AppWindow GetAppWindowForCurrentWindow()
{
    if (AppWindowTitleBar.IsCustomizationSupported())
    {
        HWND hwnd = Win32Interop.GetWindowHandleFromWindow(App.MainWindow);
        WindowId windowId = Win32Interop.GetWindowIdFromWindow(hwnd);
        return AppWindow.GetFromWindowId(windowId);
    }
    return null;
}

2. 配合原有代码保持自定义标题栏设置：
   确保你已保留以下启用自定义标题栏的代码：

Window window = App.MainWindow;
window.ExtendsContentIntoTitleBar = true;
window.SetTitleBar(AppTitleBar);

额外检查项 #

• 确认XAML中自定义标题栏元素的Background已设为Transparent（你的代码中已正确设置）。
• 确保自定义标题栏的Canvas.ZIndex足够高（你的代码中设为1，已满足需求），避免被其他元素遮挡。
• 若绑定了NavView.CompactPaneLength作为标题栏高度，需确保该值与系统标题栏高度匹配，或在导航栏状态变化时同步更新标题栏高度，防止区域重叠导致视觉异常。

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