#1,200 – Overriding a Default Style

February 26, 2017 2 Comments

In WPF, you often set up default styles to set a series of properties on all instances of a certain type of element. Below, we set a default style that applies to all TextBlock elements, using the TargetType attribute. All properties in the style will be set for all instances of the TextBlock element.

<Window.Resources>
    <ResourceDictionary>
        <Style TargetType="TextBlock">
            <Setter Property="Foreground" Value="Purple"/>
            <Setter Property="FontStyle" Value="Italic"/>
        </Style>
    </ResourceDictionary>
</Window.Resources>

<StackPanel Margin="10">
    <TextBlock Text="Fafnir"/>
    <TextBlock Text="Siegfried"/>
    <TextBlock Text="Brynhildr"/>
</StackPanel>

1200_01

Sometimes you’ll be working in an environment where these default styles have been defined for you, but you want to override them.

The first way to override a default style is to define one of your own. Below, we define a named style and use it on the second TextBlock. (The style is added to the ResourceDictionary that we showed above).

<Style x:Key="BlueBig" TargetType="TextBlock">
   <Setter Property="Foreground" Value="Blue"/>
   <Setter Property="FontSize" Value="20"/>
</Style>

<TextBlock Text="Siegfried" Style="{StaticResource BlueBig}"/>

1200_02
The second way to override a default style is to revert the element to having no style at all using the x:Null markup extension. Below, the default style exists in our application but the first and third elements indicate that that they don’t want to use it. Notice that these TextBlocks appear normally.

<TextBlock Text="Fafnir" Style="{x:Null}"/>
<TextBlock Text="Siegfried" Style="{StaticResource BlueBig}"/>
<TextBlock Text="Brynhildr" Style="{x:Null}"/>

1200_03

Advertisement

Filed under Styles Tagged with , , ,

#141 – Dependency Property Value Sources: #7 – Style Setters

November 30, 2010 1 Comment

The seventh source in the list of sources for the base value of a dependency property is a style setter. A property obtains its value from a style setter when a style is applied to the parent element and the property’s value is set using a Setter in that style.

In the example below, a button has the style redBlueTextButton applied to it. This style sets the Foreground property to red using a Setter.  It also sets the property to blue when you hover the mouse over the control. The source of the Foreground property is style (style setter) to start with and then becomes style trigger when you move the mouse over the control.

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

Filed under Dependency Properties Tagged with , , ,

#9 – Styles

July 21, 2010 4 Comments

In WPF, a style is a set of property values that you can reuse when setting similar properties for a number of controls.  You can store a style as a resource and then apply that resource to multiple controls by setting their Style property.

Let’s say that you have a set of properties that you want to apply to several buttons in your UI.  You can first define a new style as a static resource:

<Window.Resources>
    <Style x:Key="StdButton" TargetType="Button">
        <Setter Property="Width" Value="100"/>
        <Setter Property="Control.Background" Value="AliceBlue"/>
        <Setter Property="Control.FontFamily" Value="Calibri" />
        <Setter Property="Control.FontWeight" Value="Bold" />
    </Style>
</Window.Resources>

Then you can apply this style using the Style property for individual Button controls:

    <Button Content="I'm stylish" Style="{StaticResource StdButton}" />
    <Button Content="Me Too" Style="{StaticResource StdButton}" />
    <Button Content="Not me"/>

Filed under Basics Tagged with ,