Customize Acrylic Brush in UWP Applications(在UWP中自定义亚克力笔刷)

原文 Customize Acrylic Brush in UWP Applications(在UWP中自定义亚克力笔刷)

Windows 10 Fall Creators Update（Build 16299）添加了acrylic brush，这是一个类似于Windows 7 Aero效果的UI画笔。

Windows中的很多内容，例如Calculator，都会使用丙烯画笔进行更新。但是，内置刷子并不总能满足我们自己的要求。特别是当Windows自动禁用丙烯酸渲染（如低功耗模式）或非活动窗口时，它会使我们的应用程序看起来非常难看。

例如，这是正常的arcylic看起来像：

这是窗口处于非活动状态时的样子：

在这种情况下，我们将不得不构建一个自定义的arcylic画笔，并设置后退颜色。就像我使用“Character Map UWP”应用程序一样，这是一个很好的例子。

在正常模式下显示定制黑色丙烯酸：

当应用程序全屏显示或处于非活动状态时，显示系统强调颜色：

这是通过创建自定义的AcrylicBrush来完成的。在XAML资源中添加以下代码：

<AcrylicBrush x:Key="CMapUwpAcrylicBrush"
              BackgroundSource="HostBackdrop"
              TintColor="Black"
              TintOpacity="0.4"
              FallbackColor="{StaticResource SystemAccentColor}"/>

在这个例子中，TintColor 对于你想要的普通丙烯颜色，我把它设置为黑色。TintOpacity 代表opactiy 0.4表示40％。FallbackColor 是丙烯酸无法渲染的颜色，我使用系统强调颜色。

完整的XAML资源文件是：

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <ResourceDictionary.ThemeDictionaries>
        <ResourceDictionary x:Key="Default">
            <AcrylicBrush x:Key="CMapUwpAcrylicBrush"
                          BackgroundSource="HostBackdrop"
                          TintColor="Black"
                          TintOpacity="0.4"
                          FallbackColor="{StaticResource SystemAccentColor}"/>
        </ResourceDictionary>
        <ResourceDictionary x:Key="HighContrast">
            <SolidColorBrush x:Key="CMapUwpAcrylicBrush"
                             Color="{ThemeResource SystemColorWindowColor}"/>
        </ResourceDictionary>
        <ResourceDictionary x:Key="Light">
            <AcrylicBrush x:Key="CMapUwpAcrylicBrush"
                          BackgroundSource="HostBackdrop"
                          TintColor="Black"
                          TintOpacity="0.4"
                          FallbackColor="{StaticResource SystemAccentColor}"/>
        </ResourceDictionary>
    </ResourceDictionary.ThemeDictionaries>
</ResourceDictionary>

然后您可以在任何需要的地方使用这款丙烯酸刷：

<Grid Background="{ThemeResource CMapUwpAcrylicBrush}">