Explicit (Named) Styles

To apply a distinct look to a specific subset of controls, you can define an explicit style by assigning a key to the resource. Once defined, this style is not applied automatically; instead, individual controls must explicitly reference the style's key using the Style property.

In the example below, a style resource named PrimaryButtonStyle is defined within the window resources. This style sets specific dimensions and a custom background brush. Two separate buttons reference this style via StaticResource, ensuring they share the same visual presentation without affecting other buttons in the application.

<Window x:Class="StyleDemo.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Explicit Styles" Height="200" Width="400">
    <Window.Resources>
        <!-- Gradient Brush Definition -->
        <LinearGradientBrush x:Key="OceanGradient" StartPoint="0,0" EndPoint="1,0">
            <GradientStop Color="DarkBlue" Offset="0.0" />
            <GradientStop Color="LightCyan" Offset="1.0" />
        </LinearGradientBrush>

        <!-- Named Style -->
        <Style x:Key="PrimaryButtonStyle" TargetType="Button">
            <Setter Property="Background" Value="{StaticResource OceanGradient}" />
            <Setter Property="Foreground" Value="White" />
            <Setter Property="FontSize" Value="14" />
            <Setter Property="Width" Value="120" />
            <Setter Property="Height" Value="35" />
            <Setter Property="Margin" Value="5" />
        </Style>
    </Window.Resources>

    <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
        <Button Style="{StaticResource PrimaryButtonStyle}" Content="Submit Request" />
        <Button Style="{StaticResource PrimaryButtonStyle}" Content="Cancel Operation" />
        <Button Content="Default Button" Width="120" Height="35" Margin="5"/>
    </StackPanel>
</Window>

Implicit (Typed) Styles

Implicit styles allow you to define a consistent appearance for all controls of a specific type within a given scope. By omitting the x:Key attribute and specifying only the TargetType, the WPF styling engine automatically applies this style to every instance of that type that does not have an explicit style assigned.

In the following code, a style targeting TextBlock is created without a key. Consequently, all TextBlock elements within the window automatically inherit the foreground color and font settings defined in the resource.

<Window x:Class="StyleDemo.Window2"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Implicit Styles" Height="200" Width="300">
    <Window.Resources>
        <!-- Implicit Style applied to all TextBlocks -->
        <Style TargetType="{x:Type TextBlock}">
            <Setter Property="Foreground" Value="DarkSlateBlue" />
            <Setter Property="FontFamily" Value="Segoe UI" />
            <Setter Property="FontSize" Value="16" />
            <Setter Property="Margin" Value="10" />
        </Style>
    </Window.Resources>

    <StackPanel Margin="20">
        <TextBlock Text="Automatic Style Applied" />
        <TextBlock Text="Consistent Appearance" />
        <TextBlock Text="No Explicit Key Needed" />
    </StackPanel>
</Window>

Overriding Style Properties

While styles determine the default appearance of a control, local property values set directly in the XAML element declaration take precedence. This means you can apply a general style to a control but override specific atrtibutes—such as font weight, color, or size—directly on the element instance. The dependency property system resolves these values by prioritizing local setters over style setters.

The example below defines an implicit style for buttons that makes them bold. However, the second button explicitly sets its FontWeight to Normal, overriding the style's default.

<Window x:Class="StyleDemo.Window3"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Property Overrides" Height="150" Width="300">
    <Window.Resources>
        <Style TargetType="Button">
            <Setter Property="Background" Value="LightGray" />
            <Setter Property="FontWeight" Value="Bold" />
            <Setter Property="Margin" Value="5" />
        </Style>
    </Window.Resources>

    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
        <!-- Uses the Bold font weight from the style -->
        <Button Content="Styled Button" />
        
        <!-- Overrides the Bold font weight locally -->
        <Button Content="Normal Button" FontWeight="Normal" />
    </StackPanel>
</Window>

Style Inheritance

To promote reusability and maintain consistency across different control types, WPF supports style inheritance using the BasedOn attribute. You can create a base style that defines shared properties (such as fonts or margins) and then derive specific styles from it. The derived styles inherit all setters from the base style and can add new ones or override existing ones.

In this example, a BaseTextStyle is defined to set a common font family and size. Both the HeaderStyle and BodyStyle inherit from this base style, ensuring consistency while allowing for distinct foreground colors.

<Window x:Class="StyleDemo.Window4"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Style Inheritance" Height="250" Width="400">
    <Window.Resources>
        <!-- Base Style defining common font properties -->
        <Style x:Key="BaseTextStyle" TargetType="{x:Type Control}">
            <Setter Property="FontFamily" Value="Arial" />
            <Setter Property="FontSize" Value="14" />
            <Setter Property="Margin" Value="5" />
        </Style>

        <!-- Derived Style for Buttons -->
        <Style TargetType="Button" BasedOn="{StaticResource BaseTextStyle}">
            <Setter Property="Foreground" Value="White" />
            <Setter Property="Background" Value="SteelBlue" />
            <Setter Property="FontWeight" Value="Bold" />
        </Style>

        <!-- Derived Style for TextBoxes -->
        <Style TargetType="TextBox" BasedOn="{StaticResource BaseTextStyle}">
            <Setter Property="Foreground" Value="DarkGray" />
            <Setter Property="BorderBrush" Value="LightGray" />
        </Style>
    </Window.Resources>

    <StackPanel Margin="20">
        <Button Content="Submit" />
        <TextBox Text="Inherits font, custom color" />
        <Button Content="Another Button" />
    </StackPanel>
</Window>