Override App Colors in C# XAML Apps

As you may have discovered or will discover soon when making your windows 8 app in XAML, there are many out of the box themed colors for most of the common objects. 

If your App happens to be of a different color you will need to visit each object and assign a color or a reference to a new color resource.

Well you can override the template colors.

First in your App.xaml file add a reference to a Colors.xaml resource file that we will create in a moment.

   1: <Application.Resources>

   2:     <ResourceDictionary>

   3:         <ResourceDictionary.MergedDictionaries>

   4:             <ResourceDictionary Source="Resources/Colors.xaml"/>

   5:         </ResourceDictionary.MergedDictionaries>

   6:     </ResourceDictionary>

   7: </Application.Resources>

Next Create a Resource Dictionary File Colors.xaml.

The content should contain the following.

   1: <ResourceDictionary

   2:  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

   3:  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

   4: <Color x:Key="AppRedColor">#FFF11F2A</Color>

   5:  <Color x:Key="AppPurpleColor">#FF585A8E</Color>

   6:  <Color x:Key="AppLightGrey">#FF898989</Color>

   7:  <Color x:Key="AppBlueColor">#FF109FDA</Color>

   8:  <Color x:Key="AppGreenColor">#FF59BA47</Color>

   9: <SolidColorBrush x:Key="AppLightGreyBrush" Color="{StaticResource AppLightGrey}"/>

  10:  <SolidColorBrush x:Key="AppRedBrush" Color="{StaticResource AppRedColor}"/>

  11:  <SolidColorBrush x:Key="AppBlueBrush" Color="{StaticResource AppBlueColor}"/>

  12:  <SolidColorBrush x:Key="AppGreenBrush" Color="{StaticResource AppGreenColor}"/>

  13:  <SolidColorBrush x:Key="AppPurpleBrush" Color="{StaticResource AppPurpleColor}"/>

  14:  <SolidColorBrush x:Key="AppLightPurpleBrush" Opacity="0.3" Color="{StaticResource AppPurpleColor}"/>

  15:  <SolidColorBrush x:Key="AppVeryLightPurpleBrush" Opacity="0.1" Color="{StaticResource AppPurpleColor}"/>

  16:  <!-- Theme Overrides -->

  17:  <SolidColorBrush x:Key="ApplicationForegroundThemeBrush" Color="{StaticResource AppPurpleColor}" />

  18:  <SolidColorBrush x:Key="ComboBoxItemSelectedBackgroundThemeBrush" Color="{StaticResource AppBlueColor}" />

  19:  <SolidColorBrush x:Key="ComboBoxItemSelectedForegroundThemeBrush" Color="White" />

  20:  <SolidColorBrush x:Key="ComboBoxItemSelectedPointerOverBackgroundThemeBrush" Color="{StaticResource AppBlueColor}" />

  21:  <SolidColorBrush x:Key="ComboBoxSelectedBackgroundThemeBrush" Color="{StaticResource AppBlueColor}" />

  22:  <SolidColorBrush x:Key="ComboBoxSelectedPointerOverBackgroundThemeBrush" Color="{StaticResource AppBlueColor}" />

  23: <SolidColorBrush x:Key="ProgressBarIndeterminateForegroundThemeBrush" Color="{StaticResource AppBlueColor}" />

  24: <SolidColorBrush x:Key="ListViewItemPlaceholderBackgroundThemeBrush" Color="{StaticResource AppPurpleColor}" />

  25:  <SolidColorBrush x:Key="ListViewItemSelectedBackgroundThemeBrush" Color="{StaticResource AppBlueColor}" />

  26:  <SolidColorBrush x:Key="ListViewItemSelectedPointerOverBackgroundThemeBrush" Color="{StaticResource AppBlueColor}" />

  27:  <SolidColorBrush x:Key="ListViewItemSelectedPointerOverBorderThemeBrush" Color="{StaticResource AppBlueColor}" />

  28: </ResourceDictionary>

Advertisements