MSDN Community

Introduction to XAML Resources

Resources in XAML let you define reusable objects such as brushes, styles, templates, and data objects that can be shared across a UI. By centralizing these definitions, you achieve consistency, simplify maintenance, and enable theming.

StaticResource

StaticResource looks up a resource at load time. It’s fast and ideal for values that don’t change after the UI is rendered.

<Window.Resources>
    <SolidColorBrush x:Key="AccentBrush" Color="#FF0078D7"/>
</Window.Resources>

<Button Background="{StaticResource AccentBrush}" Content="Click me"/>

DynamicResource

DynamicResource resolves the resource at runtime and will automatically update the UI if the resource changes (e.g., when switching themes).

<Window.Resources>
    <SolidColorBrush x:Key="AccentBrush" Color="#FF0078D7"/>
</Window.Resources>

<Button Background="{DynamicResource AccentBrush}" Content="Dynamic"/>

Changing the brush programmatically will refresh the button instantly.

Theme Dictionaries

Separate resource dictionaries for light and dark themes let you swap entire visual styles with a single line of code.

<ResourceDictionary.MergedDictionaries>
    <ResourceDictionary Source="Themes/Light.xaml"/>
</ResourceDictionary.MergedDictionaries>

Switch to dark theme by loading Themes/Dark.xaml at runtime.

Merged Dictionaries

Use MergedDictionaries to split resources into logical groups (styles, converters, templates) and keep XAML files manageable.

<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="Resources/Colors.xaml"/>
            <ResourceDictionary Source="Resources/Styles.xaml"/>
            <ResourceDictionary Source="Resources/Converters.xaml"/>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

Full Example: A Themed Button

This example demonstrates a reusable button style that adapts to light and dark themes using DynamicResource.

<!-- Light.xaml -->
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
    <SolidColorBrush x:Key="PrimaryBrush" Color="#FF0078D7"/>
    <Style TargetType="Button" x:Key="ThemedButton">
        <Setter Property="Foreground" Value="White"/>
        <Setter Property="Background" Value="{DynamicResource PrimaryBrush}"/>
        <Setter Property="Padding" Value="10,5"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="CornerRadius" Value="4"/>
    </Style>
</ResourceDictionary>

<!-- Dark.xaml -->
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
    <SolidColorBrush x:Key="PrimaryBrush" Color="#FF0050A0"/>
    <!-- Reuse the same ThemedButton style -->
</ResourceDictionary>

<!-- MainWindow.xaml -->
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Themed Button Demo" Height="200" Width="400">
    <Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="Themes/Light.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Window.Resources>
    <Grid>
        <Button Style="{StaticResource ThemedButton}" Content="Click Me"/>
    </Grid>
</Window>

Toggle the theme at runtime:

private void ToggleTheme()
{
    var dict = new ResourceDictionary
    {
        Source = new Uri(
            IsDark ? "Themes/Light.xaml" : "Themes/Dark.xaml",
            UriKind.Relative);
    };
    Application.Current.Resources.MergedDictionaries.Clear();
    Application.Current.Resources.MergedDictionaries.Add(dict);
}