覆盖页面

时间:2017-02-22 13:55:01

标签: xaml uwp uwp-xaml

我想在特定页面的范围内覆盖主题资源,特别是SystemAccentColor。 我已经成功地在应用范围内完成了它。但我无法针对特定页面进行此操作。

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

    <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(这不起作用)

   <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" />

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

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

但是,如果我这样做

Page.xaml

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

然后ProgressBar获得正确的前景值。这意味着卵子确实发生了。

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

1 个答案:

答案 0 :(得分:0)

最好的方法是使用Visual Studio或&#39; Blend for Visual Studio&#39;。我正在使用Visual Studio

  1. 右键单击要编辑的元素(在您的情况下,进度条)&gt;选择&#39;编辑模板&#39; &GT; &#39;编辑副本&#39;
  2. enter image description here

    1. A&#39;创建样式资源&#39;显示,输入您的风格和名称;在&#39;定义中&#39;部分,选择&#39;本文件&#39; (这确保样式仅适用于页面/窗口而不是应用程序范围)并单击“确定”
    2. enter image description here

      立即,进度条使用您创建的新样式包含样式属性(请参阅上图)。您可以继续修改IDE插入的代码段,以满足您的想象力。

      enter image description here

      我希望这会有所帮助。