如何在C#/XAML Windows应用商店(Metro UI)应用程序中混合浅色和深色主题

本文关键字：混合 应用程序 UI Metro XAML Windows 应用 | 更新日期: 2023-09-27 18:00:31

根据MSDN，设置应用程序主题的标准方法是在顶级Application实例上设置RequestedTheme="Dark"或RequestedTheme="Light"。

这适用于简单的应用程序，但很多时候我发现自己想更改单个页面甚至单个控件的主题（例如，同一应用程序中的浅色主题文本编辑页面与深色主题图像查看器）。

XAML控件有10或100秒的视觉状态和颜色定义，手动设置每一个都很乏味，很难做到100%正确！

有没有一种简单的方法可以在单个控件上设置深色或浅色主题？

如何在C#/XAML Windows应用商店(Metro UI)应用程序中混合浅色和深色主题

对于XAML窗口存储应用程序，控件的默认外观在Common/StandardStyles.xaml中定义。如果您看过该文件，就会注意到有大量的引用，如{StaticResource ApplicationForegroundThemeBrush}。看起来很有希望。。。

不幸的是，这些"主题画笔"并没有在你的应用程序中的任何地方定义，也没有简单的方法可以为单个控件设置亮或暗覆盖。然而，有一个答案。

幸运的是，Joe White有一篇关于默认主题颜色的优秀博客文章，我把它变成了一本资源词典，你可以在这里找到。Dropbox只进行xml预览，因此您必须重命名文件。

不过，将这些资源复制到你的应用程序本身并没有帮助。要使用它们，您需要通过外科手术覆盖默认的控制样式来使用它们！

一种方法是创建一个新的资源字典，例如在Common/CustomStyles.xaml，并将其合并到应用程序的资源中，如下所示：

<Application
    x:Class="My.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    RequestedTheme="Light">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <!-- 
                    Styles that define common aspects of the platform look and feel
                    Required by Visual Studio project and item templates
                 -->
                <ResourceDictionary Source="Common/ThemeColors.xaml"/>
                <ResourceDictionary Source="Common/StandardStyles.xaml"/>
                <ResourceDictionary Source="Common/CustomStyles.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

请注意，我们的默认主题是Light。如果我们想制作一个以Dark为主题的TextBlock，让我们复制StandardStyles.xaml中的视觉样式，并将其添加到我们的CustomStyles.xaml中，然后进行一些更改。

<Style x:Key="BasicRichTextStyleDark" TargetType="RichTextBlock">
    <Setter Property="Foreground" Value="{StaticResource ApplicationForegroundThemeBrushDark}"/>
    <Setter Property="FontSize" Value="{StaticResource ControlContentThemeFontSize}"/>
    <Setter Property="FontFamily" Value="{StaticResource ContentControlThemeFontFamily}"/>
    <Setter Property="TextTrimming" Value="WordEllipsis"/>
    <Setter Property="TextWrapping" Value="Wrap"/>
    <Setter Property="Typography.StylisticSet20" Value="True"/>
    <Setter Property="Typography.DiscretionaryLigatures" Value="True"/>
    <Setter Property="Typography.CaseSensitiveForms" Value="True"/>
</Style>

请注意，我们已将Dark附加到样式名称和主题画笔定义中您可以通过在CustomStyles.xaml文件中查找并替换"ThemeBrush}"=>"ThemeBrushDark}"来执行此操作。

现在你可以创建一个深色主题的文本块，如下所示：

<TextBlock Style="{StaticResource BasicRichTextStyleDark}"/>

当然，您也可以将此技术用于任何其他类型的控件。有点乏味，但结果是正确的，而且还没有手动定义每种颜色那么糟糕！

这里没有魔法我们只是定义了一些颜色，并用我们复制、粘贴和修改以使用我们的颜色的样式覆盖默认样式。

令人惊讶的是，一个似乎没有被提及的解决方案只是在单个控制元素上使用RequestedTheme="Dark"或RequestedTheme="Light"

我这样做是为了一个应用程序，我需要将一些应用程序按钮设置为深色设置（即白色前景），因为foreground属性没有将圆圈和字形本身都设置为白色：

<AppBarButton Label="Reload all articles" RequestedTheme="Dark" >

这样，我只是强迫控件使用我决定的主题。

在Common文件夹中，您有一个StandardStyles.xaml文件。

在这里，您可以找到Metro应用程序的所有默认标准样式。您需要取消注释要使用的样式，并将其作为StaticResource添加到控件中。

我在设计应用程序"通讯录"时也遇到了同样的问题，因为我也想在Dark&浅色主题。对于您的问题："如何在C#/XAML Windows应用商店（Metro UI）应用程序中混合浅色和深色主题？"，我有一个出色的解决方案

  • 我用相同的代码做了两页&相同的内容。我把这两个页面一个加在另一个上面，然后我在这两种主题之间进行了动态的改变；黑暗的我给了用户一个选项，无论他们想要深色布局还是浅色布局&根据用户的选择，我已经应用了主题。在这种情况下我成功了

第二个解决方案：

  • 如果您希望应用程序具有动态外观，那么您可以制作自己的静态布局类型，然后可以绑定静态资源到要在其上应用该类型的风格

如果你没有在这里找到答案，请原谅，但我认为这可能会帮助你在"黑暗"answers"黑暗"之间动态切换；"轻"主题设置在您的win 8 metro应用程序中。

相关文章：