UWP 应用程序中的自定义主题

Question

我正在开发一个 UWP 应用程序，我想在其中从一个文件（包含颜色代码）动态设置主题。

我创建的文件是一个 XML 文件，其节点包含映射到应用程序控件的颜色代码。

用户可以更新提供的 XML 文件中的颜色代码，这应该反映应用程序中的主题更改。

我可以为此文件设置任何自定义位置，以便用户可以编辑文件的内容吗？

这是在 UWP 应用程序中实现主题的正确方法吗？

另外，我是 UWP 技术的新手。

提前致谢。

Answer 1

默认情况下，UWP 应用支持两个主题 - Light 和 Dark。

您可以通过将RequestedTheme 属性设置为任一值（默认设置为Light）或在应用构造函数中使用RequestedTheme = ApplicationTheme.Light; 在App.xaml.cs 中指定应用程序的主题，方法是在App.xaml 中指定应用程序的主题（以后在任何地方更改它都会导致抛出异常）。

如果您不设置RequestedTheme 属性，它将在运行周年更新和更新版本的任何W10 移动设备或W10 PC 上反映Settings > Personalization > Colors 中设置的主题。在较旧的 Windows 10 桌面版本上，它将是 Light。

您还可以设置任何特定FrameworkElement 的主题，默认情况下设置为ElementTheme.Default，以便它从其父主题继承主题。

<StackPanel RequestedTheme="Light">
   <TextBlock>Text using light theme.</TextBlock>
   <TextBlock RequestedTheme="Dark">Text using dark theme.</TextBlock>
</StackPanel>

对于颜色自定义，UWP 通常也使用用户在Settings > Personalization > Colors 中指定的强调色。

要反映设置应用程序中设置的主题和强调色，为某些元素指定自定义颜色，您必须使用ThemeResource。您可以使用预定义的 XAML 主题资源，例如此边框的背景颜色将在 Light 主题中为 #FFFFFFFF，在 Dark 主题中为 #FF000000。

<Border Background="{ThemeResource SystemControlBackgroundAltHighBrush}"/>

或者您可以使用SystemControlBackgroundAccentBrush，这将反映在“设置”应用中选择的强调色。

您还可以编写自己的theme dictionary，为每个主题指定颜色。下面是一个简单的主题词典示例：

<ResourceDictionary.ThemeDictionaries>
    <ResourceDictionary x:Key="Light">
        <SolidColorBrush x:Key="MyButtonBackgroundThemeBrush" Color="White"/
        <SolidColorBrush x:Key="MyButtonForegroundThemeBrush" Color="Black"/>
    </ResourceDictionary>
    <ResourceDictionary x:Key="Dark">
        <SolidColorBrush x:Key="MyButtonBackgroundThemeBrush" Color="Black"/>
        <SolidColorBrush x:Key="MyButtonForegroundThemeBrush" Color="White"/>
    </ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>

你会这样使用它：

<Button Content="Themed button"
        Background="{ThemeResource MyButtonBackgroundThemeBrush}"
        Foreground="{ThemeResource MyButtonForegroundThemeBrush}"/
        />

在Light 主题中，按钮的背景为White，前景为Black，在Dark 主题中为Black 和White。

您可以阅读有关ThemeResource、主题、​​HighContrast 主题和默认主题资源here 的更多信息。

另外，我建议您观看第 9 频道的 this 视频，其中即使使用 HighContrast 主题也解释了 XAML 主题。