WinUI3_设置原生态标题栏样式

原创已于 2025-07-13 21:59:46 修改 · 380 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#WinUI3

于 2025-06-25 11:18:30 首次发布

Windows_核心编程专栏收录该内容

92 篇文章

订阅专栏

简介

Windows原生态标题栏是基于Windows SDK自带的样式标题栏，非用户自定义标题栏，当用户使用ExtendsContentIntoTitleBar时Windows会将窗口区域（也就是客户区内容）里的内容样式扩展到标题栏里，也就是替换掉Windows原生态标题栏的样式了，标题和图标会消失但关闭按钮、最大化按钮、最小化按钮并不会，因为最大化和最小化、关闭按钮在Windows里被定义为属于非客户区内容，这几个组件会被保留，但是动画效果就没了。因为当你使用ExtendsContentIntoTitleBar接管标题栏区域后它的动画样式也一并被接管了，系统只保留非客户区的三个组件最大化最小化和关闭按钮以外的所有系统样式都会被取消，也就出现当我们使用ExtendsContentIntoTitleBar之后最大化最小化和关闭按钮没有淡入淡出动画了，也就是视觉效果后退了。
最好的解决方案是使用PreferredHeightOption将属性设置为Collapsed然后自己完全绘制最大化最小化和关闭按钮，这样动画效果也就有了，但是自己定义的话需要自己去实现snap layouts，这个较为麻烦，但还有一种方法，就是在你窗口使用系统主题色时，将标题栏样式也更改为主题色，这样既让Windows帮我们处理原生态动画和snap layouts也能让整体看起来更协调美观。

Tips
使用此方法需要确保你的Windows SDK版本在1.7以上，可以通过NuGet升级

使用方法

下面代码是一个开启mica效果的窗口
在这里插入图片描述
可以看到标题栏样式非常不融洽，接下来使用PreferredTheme修改一下标题栏样式，我的系统主题是深色：
首先需要包含对应的头文件：

#include <winrt/Microsoft.UI.Windowing.h>
#include <winrt/impl/Microsoft.UI.Windowing.0.h>
using namespace winrt::Microsoft::UI::Windowing;

然后使用PreferredTheme修改一下主题色：

this->AppWindow().TitleBar().PreferredTheme(TitleBarTheme::Dark);

效果如下：
在这里插入图片描述
可以看到非常融洽，如果想要跟随主题色可以使用UseDefaultAppMode来自适应主题色。
同时snap layouts布局也支持

Tips
该效果在Mica Alt下不是很和谐，Mica Alt主要是深色，而系统标题栏仅支持默认的Dark和Light，如果使用Mica Alt的话标题栏看起来会有层次感
其主要原因是因为窗口区域使用的是Mica Alt，而标题栏则是使用的是Base Mica