Question

I want to create a solidbrush resource in my app that will change color depending on the selected theme.

Is there anyway to do this?

Answer 1

okay I figured it out. In StandardStyles.xaml there is a section

Here you can add the same solid brush element for each different theme.

<ResourceDictionary.ThemeDictionaries>
    <ResourceDictionary x:Key="Default">
        <x:String x:Key="BackButtonGlyph">&#xE071;</x:String>
        <x:String x:Key="BackButtonSnappedGlyph">&#xE0BA;</x:String>
        <SolidColorBrush x:Key="ListViewItemSelectedBackgroundThemeBrush" Color="#CEE3F8"></SolidColorBrush>
        <SolidColorBrush x:Key="ListViewItemPointerOverBackgroundThemeBrush" Color="#E0E0E0"></SolidColorBrush>
        <SolidColorBrush x:Key="ListViewItemSelectedPointerOverBackgroundThemeBrush" Color="#CEE3F8"></SolidColorBrush>
        <SolidColorBrush x:Key="ListViewItemSelectedPointerOverBorderThemeBrush" Color="#CEE3F8"></SolidColorBrush>
        <SolidColorBrush x:Key="HeaderBrush" Color="#FF8AA1B8">

        </SolidColorBrush>
    </ResourceDictionary>
    <ResourceDictionary x:Key="Light">
        <SolidColorBrush x:Key="HeaderBrush" Color="#FFCEE3F8">

        </SolidColorBrush>
    </ResourceDictionary>
    <ResourceDictionary x:Key="HighContrast">
        <x:String x:Key="BackButtonGlyph">&#xE0A6;</x:String>
        <x:String x:Key="BackButtonSnappedGlyph">&#xE0C4;</x:String>
    </ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>

Here I added a “Light” theme and added a solid brush called “HeaderBrush” to 2 of the themes.

To implement this brush just add it as a resource to the element. Like so…

<AppBar x:Name="BottomAppBar1"   Padding="10,0,10,0" BorderBrush="Blue"  BorderThickness="0 1 0 0" Background="{ThemeResource HeaderBrush}"  AutomationProperties.Name="Bottom App Bar" Opened="BottomAppBar1_Opened" Closed="BottomAppBar1_Closed">

Here I set the brush to the background color, and now it changes automatically with with theme.