How to define your own Windows 8 App Theme?

Question

For a school assignement I'm doing some basic research on how Windows 8 Store App Development works. I followed the Hello World tutorial provided by Microsoft. The main themes you can use for the app are Light and Dark (and if I'm correct there's a third one High Contrast or something?), these are defined by MS.

My question is, how can I create my own theme? I'd like to have a basic App Theme with the two main colours defined by me. I think this would be possible, but I haven't found any way of doing it. Looked here on stackoverflow, but didn't find anything helpful (most mention files and such not present in the simple Hello World app).

In short: is it possible to create a theme for you Windows 8 app (mainly choosing the foreground and background colours), comparable to the standard provided Dark and Light themes?

Joe Joe · Accepted Answer · 2014-02-17T10:27:33

Your best off using a resource dictionary to hold information on your custom styles.

~~(This is a WPF example, I'm assuming it's the same for apps, if not, let me know).~~

In your App.xaml, add a merged dictionary, so your App.xaml may look something like this:

<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="Style/CoreStyle.xaml" />
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

You will then need to create a resource dictionary (in my example, I put it in Style/CoreStyle.xaml)

You can then style individual elements in your project, for example, setting a minwidth on a button will look something like:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style TargetType="{x:Type Button}">
        <Setter Property="MinWidth" Value="75" />
    </Style>
</ResourceDictionary>

There is a lot more information on the MSDN Styling and Templating Guide which I'd recommend reading.

How to define your own Windows 8 App Theme?

2 Answers