#139 – Dependency Property Value Sources: #5 – Style Triggers

The fifth source in the list of sources for the base value of a dependency property is a style trigger. A property obtains its value from a style trigger when a style is applied to the parent element and the property’s value changes as a result of a trigger firing.

In the example below, a button has the style blueTextButton applied to it.  This style sets the Foreground property to blue when you hover the mouse over the control.  The source of the Foreground property then becomes style trigger when the trigger fires.

    <Window.Resources>
        <Style x:Key="blueTextButton">
            <Style.Triggers>
                <Trigger Property="Button.IsMouseOver" Value="True">
                    <Setter Property="Button.Foreground" Value="Blue"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <StackPanel Orientation="Vertical">
        <Button Content="Run" Height="23" Width="75" Style="{StaticResource blueTextButton}" />
        <Button Content="Skip" Height="23" Width="75" />
    </StackPanel>
Advertisement

#138 – Dependency Property Value Sources: #4 – Implicit Style

The fourth source in the list of sources for the base value of a dependency property is an implicit style.  This rule applies only to the Style dependency property.

The Style property obtains its value implicitly when a style is applied to all elements whose type matches the specified TargetType of the style.

Since an explicit style is treated as a local value, the resulting precedence list for the Style property, highest to lowest, is:

  • Explicit style (local value)
  • Implicit style
  • Default value

In the example below, we use an implicit style to set the style of two different Button elements.

    <Window.Resources>
        <Style TargetType="Button">
            <Setter Property="Control.FontStyle" Value="Italic"/>
        </Style>
    </Window.Resources>
    <StackPanel>
        <Button Content="Click Me" Height="23" Width="125" />
        <Button Content="Or Me" Height="23" Width="125" />
    </StackPanel>