UWP Resourses

Introduction

In new Windows 10 Applications, there are many ways to reference a resource inside XAML code or in code behind.

First, you have to declare the resources in some accessible place. The easy way is to declare a ResourceDictionary in context, let's say, in the current page.

Examples

1. Resource Dictionary

Snippet from MainPage.xaml

<Page
    x:Class="MyNewApp.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:MyNewApp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Page.Resources>
        <!-- Creates a resource dictionary in the page context -->
        <ResourceDictionary>
            <!-- This is a solid color brush resource
                 NOTE: Each resource inside a resource dictionary must have a key -->
            <SolidColorBrush x:Key="ColorRed">Red</SolidColorBrush>
        </ResourceDictionary>
    </Page.Resources>

    <!-- Using ThemeResource in here to access a resource already defined -->
    <Grid Background="{ThemeResource ColorRed}">

    </Grid>
</Page>

2. Global Resources
   Resource dictionaries are accessible only inside the context they were declared, so if we intend to reference resources that are declared in one page context from another page, they will not be found. If we need global resources to be defined, like the ones that comes with the framework, we do it in App.xaml

Snippet from App.xaml

<Application
    x:Class="MyNewApp.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    RequestedTheme="Dark">

    <Application.Resources>
        <ResourceDictionary>
            <SolidColorBrush x:Key="ColorRed">Red</SolidColorBrush>
        </ResourceDictionary>
    </Application.Resources>
</Application>

This way, we can access ColorRed color resources from anywhere in our app. But wait — we don't want to infest that little file with all our app's resources! We will do MergedDictionaries.

3. Merged Dictionaries
   Things are almost always a little bit more complex. To support scalability, we should split things up so that we can define various files containing different resources dictionaries, i.e. resources for UI controls themes, resources for texts and so on, and merge them all together in a App.xaml file.

Snippet from App.xaml

<Application
    x:Class="MyNewApp.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    RequestedTheme="Dark">

    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Assets/Themes/GeneralStyles.xaml"/>
                <ResourceDictionary Source="/Assets/Themes/TemplatedControls.xaml"/>
                <ResourceDictionary Source="/Assets/Strings/Texts.xaml"/>
                <ResourceDictionary Source="/Assets/Strings/ErrorTexts.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

You can create a new dictionary file by right clicking on Asset folder [Add -> New Item]

Enter the image description here.

4. Accessing Resources
   We now need access to our declared resources. In order to do that from the XAML code, we use {ThemeResource ResourceKey} or {StaticResource ResourceKey}

To be continued later.