覆盖页面范围内的主题资源 [英] Override theme resource in the scope of a Page

问题描述

我想覆盖特定页面范围内的主题资源，特别是 SystemAccentColor.我已经在广泛的应用范围内成功地做到了.但我无法为特定页面执行此操作.

I want to override a theme resource, specifically the SystemAccentColor, in the scope of a specific page. I have successfully done it in application wide scope. But I can't do it for a specific page.

App.xaml 中的 XAML(这很好用)

XAML in App.xaml (this works fine)

    <Application.Resources>        
        <ResourceDictionary>  
            <ResourceDictionary.ThemeDictionaries>
                <ResourceDictionary x:Key="Default">
                        <Color x:Key="SystemAccentColor">#862E2D</Color>
                        <SolidColorBrush x:Key="SystemControlHighlightAccentBrush" Color="Black"/>
                </ResourceDictionary>
            </ResourceDictionary.ThemeDictionaries>
        </ResourceDictionary>
    </Application.Resources>

Page.xaml 中的 XAML(这不起作用)

XAML in Page.xaml (this doesn't work)

   <Page.Resources>
        <ResourceDictionary>
            <ResourceDictionary.ThemeDictionaries>
                <ResourceDictionary x:Key="Default">
                    <Color x:Key="SystemAccentColor">#111111</Color>  
                    <SolidColorBrush x:Key="SystemControlHighlightAccentBrush" Color="Black"/>                 
                </ResourceDictionary>
            </ResourceDictionary.ThemeDictionaries>          
        </ResourceDictionary>
    </Page.Resources>

    <!-- Control to test that the resource is overriden. The `ProgressBar` uses the accent color by default -->
    <ProgressBar 
        Height="10" 
        Grid.ColumnSpan="3"
        VerticalAlignment="Top"              
        IsIndeterminate="True" />

我不知道为什么资源没有在页面范围内被覆盖.

I don't know why the resource is not overridden in the scope of the page.

我尝试从 App.xaml 中删除覆盖，并且只覆盖 Page.xaml 中的资源，但这也不起作用.

I have tried removing the override from App.xaml and only overriding the resources in Page.xaml but that doesn't work either.

但是如果我这样做

Page.xaml

 <ProgressBar 
     Height="10" 
     Grid.ColumnSpan="3"
     VerticalAlignment="Top"              
     IsIndeterminate="True"
     Foreground="{StaticResource SystemControlHighlightAccentBrush}"/>

然后 ProgressBar 获得正确的前景值.这意味着 override 确实发生了.

Then the ProgressBar gets the correct foreground value. Which means that the ovverride does take place.

有人知道为什么会这样吗?或者如何覆盖特定页面的主题资源?

Does anybody know why this is happening? Or how I can override a theme resource for a specific page?

推荐答案

最好的方法是使用 Visual Studio 或Blend for Visual Studio".我正在使用 Visual Studio

The best way is using Visual Studio or 'Blend for Visual Studio'. I'm using Visual Studio

1. 右键单击要编辑的元素(在您的情况下为进度条)> 选择编辑模板">编辑副本"

1. 出现创建样式资源"，输入您的样式名称在定义于"部分中，选择此文档"(这可确保样式仅适用于页面/窗口而不是应用程序范围)，然后单击确定

立即，进度条包含一个使用您创建的新样式的样式属性(见最后一张图片).您可以继续修改 IDE 插入的代码片段，以适应您的想象.

Immediately, the Progress Bar includes a style attribute (see last image) using the new style you created. You can go ahead and modify the code snippet inserted by the IDE to suite your imagination.

我希望这会有所帮助.

这篇关于覆盖页面范围内的主题资源的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！