How to make a Style generic so I can use it in my entire application?

Question

I've search around here on SO and what not able to find a clear answer explaining how to setup a 'style resource'. In my case my dialog controls several buttons and lists, and other various controls which I want to set a generic theme/style for. Similar to how you would do using a CSS file in HTML.

For the sake of simplicity in this example I have a style i want to use across the board on all my buttons. However I would prefer not to contain all these style resources in the xaml of my UI layout. I would like to move the styles to a general xaml resource file which would contain just the styles, that way i could also easily reference them into other wpf dialogs throughout the tool.

How do I set this up to make use of a general resource file containing styles for the various controls in my tool? Then be able to reference and use that style in my xaml UI's.

Thank you

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="200" Width="200">

    <Window.Resources>
        <Style TargetType="Button" x:Key="CoolButton" >
            <Setter Property="Margin" Value="1,2,1,2"/>
            <Setter Property="Background" Value="LightBlue"/>
            <Setter Property="HorizontalAlignment" Value="Left"/>
            <Setter Property="FontSize" Value="12" />
            <Setter Property="FontFamily" Value="Calibri" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border Background="{TemplateBinding Background}"
                    BorderBrush="Lavender" BorderThickness="5" CornerRadius="6,0,6,0" x:Name="bd">
                            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                    Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" RecognizesAccessKey="True" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="bd" Property="Background" Value="LightGray"/>
                                <Setter Property="Foreground" Value="White" />
                                <Setter Property="Cursor" Value="Hand" />
                            </Trigger>

                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

    <StackPanel>
        <Button Style="{StaticResource CoolButton}" Content="Button" Margin="2" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75"/>
        <Button Style="{StaticResource CoolButton}" Content="Button" Margin="2" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75"/>
        <CheckBox Margin="2" Content="Great"></CheckBox>

    </StackPanel>
</Window>

On a side note why does this not work to use variables for colors in the resource style xaml?

    <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

        <!--COLORS-->
        <Color x:Key="AccentColor">#CC4021</Color>


        <Style TargetType="Button">
            <Setter Property="Foreground" Value="{StaticResource AccentColor}"/>
        </Style>

</ResourceDictionary>

Answer 1

There are a few steps to follow from making a instance-specific style a generic style.

1. Remove the Key. This will make the style to be used for every button:

   <Style TargetType="Button">
   

2. Move it to a resource file, for example Default.xaml:

   <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   >
       <Style TargetType="Button">
           ...
       </Style>
   </ResourceDictionary>
   

3. Include a reference to the resource from a central point, for example the App.xaml, which will load the resources. The App.xaml will cause the styles to be used application-wide in just one go:

   <Application x:Class="..."
                xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
       <Application.Resources>
           <ResourceDictionary>
               <ResourceDictionary.MergedDictionaries>
                   <ResourceDictionary Source="Default.xaml" />                 
               </ResourceDictionary.MergedDictionaries>
           </ResourceDictionary>
       </Application.Resources>
   </Application>