WinUI3开发_设置主题颜色

简介

在WinUI3中，除了你去主动修改主题以外，还可以主动去设置主题，目前WinUI3支持两种主题色，分别是深色(Dark)与浅色(Light)，通过ElementTheme枚举类型进行表示，Default表示跟随系统主题。

 enum class ElementTheme : int32_t
 {
     Default = 0,
     Light = 1,
     Dark = 2,
 };

在WinUI3里可以主动去获取某个元素然后调用该元素的RequestedTheme方法来设置对应的主题，当使用该方法修改主题色之后该元素里的所有子元素也会一并继承父元素的样式，该方法继承自FrameworkElement类，使用此功能需要XML组件初始化完成才能使用，所以需要调用InitializeComponent来完整初始化组件之后才可以使用该类的功能。

使用方法

在调用RequestedTheme之前需要获取一个元素，也就意味着你的窗口里至少要有一个元素存在，可以通过XML来定义一个元素，这里定义一个Grid布局元素：

<Grid x:Name="MyGrid">
</Grid>

然后在c++代码里直接修改它的主题

 // 初始化组件
 InitializeComponent();
 // 设置为mica效果
 MicaBackdrop mica = MicaBackdrop();
 mica.Kind(MicaKind::BaseAlt);
 DesktopAcrylicBackdrop acrylic = DesktopAcrylicBackdrop();
 this->SystemBackdrop(mica);
 // 扩展标题栏
 this->ExtendsContentIntoTitleBar(true);
 // 设置主题为亮色
 MyGrid().RequestedTheme(ElementTheme::Light);

你也可以在xml里直接使用RequestedTheme属性

 <Grid x:Name="MyGrid" RequestedTheme="Light">
 </Grid>

不过这样有一个缺点，因为系统主题色是深色，标题栏的控制按钮属于非客户区的，它不会被改变主题，依然是深色主题的样式，呈现白色，当我们把主题设置为浅色时会导致控制按钮看起来与背景融为一体了，有一点看不清楚

解决方案就是手动设置颜色，当为浅色时手动将控制按钮的颜色设置为浅色主题色也就是黑色，当为深色时手动设置为深色的主题色也就是白色，设置控制按钮颜色的API有8个：
ButtonForegroundColor： 按钮默认颜色
ButtonHoverForegroundColor： 鼠标悬停时颜色
ButtonPressedForegroundColor： 鼠标按下时颜色
ButtonInactiveForegroundColor： 窗口非激活时颜色
ButtonBackgroundColor： 按钮背景色
ButtonHoverBackgroundColor： 鼠标悬停时背景色
ButtonPressedBackgroundColor： 鼠标按下时背景色
ButtonInactiveBackgroundColor： 窗口失焦时背景色
这里我们只需要使用ButtonForegroundColor就可以了：
这里将其设置为黑色

this->AppWindow().TitleBar().ButtonForegroundColor(winrt::Windows::UI::ColorHelper::FromArgb(255, 0, 0, 0));

运行效果：