WPF_11_ Style and behavior

Keywords: WPF

WPF provides several features that allow you to insert something you like into the basic elements and standardize the visual appearance of the program.

  • Style - an important tool for organizing and reusing formatting options.
  • Behavior - encapsulates some common UI functions.


    <!--Like resources, styles have a key name, usually in Style ending-->
    <Style x:Key="BigFontButtonStyle">
        <Setter Property="Control.FontFamily" Value="Times New Roman"/>
        <Setter Property="Control.FontSize" Value="18"/>
        <Setter Property="Control.FontWeight" Value="Bold"/>

The Style is inserted into the element through the Style attribute of the element (defined in the FrameworkElement base class).

<Button Name="cmd" Style="{StaticResource BigFontButtonStyle}"/>

Style sets the initial appearance of the element. If the corresponding attributes are set, the style will be overwritten. Ideally, you should not rely on this behavior - you should create more styles to allow more flexibility in adjusting the interface.

The Style class has five important attributes:

attribute explain
Setters Sets the property value and the Setter object or collection of EventSetter objects that automatically associate event handlers
Triggers A collection of objects that inherit from the TriggerBase class and can automatically change style settings
Resources Resource collection for styles
BasedOn Create more specific styles that inherit from other style settings
TargetType Identifies the type of element to which the style is applied

If you want to use the same font for a group of controls, you don't want to use the same style for each control. In this case, you can put them in the container and set the style of the container. As long as the set attribute has the attribute value inheritance attribute, these values will be passed to the child element.

If you decide to use automatic styling to set the appearance, do not use attribute inheritance to avoid becoming more complex. At this point, you can try to use explicit styles for special cases.

Property setters are the most common feature of all styles, but you can also create a collection of EventSetter objects that associate a specific handler with an event.

<Style x:Key="MouseOverHighlightStyle">
    <EventSetter Event="TextBlock.MouseEnter" Handler="element_MouseEnter"/>
    <EventSetter Event="TextBlock.MouseLeave" Handler="element_MouseLeave"/>
    <Setter Property="TextBlock.Padding" Value="5"/>


Use triggers to automate simple style changes, which usually require the use of template event processing logic. Triggers are linked to styles through the Style.Triggers collection, and each trigger is an instance of a derived class of System.Windows.TriggerBase.

Implementation class explain
Trigger Detect changes in attributes
MultiTrigger Multi condition trigger
DataTrigger Monitor changes in bound data
MultiDataTrigger Multiple data triggers
EventTrigger When an event occurs, the trigger applies animation

By using the FrameworkElement.Triggers collection, triggers can be applied directly to elements without creating styles, but only event triggers are supported.

<Style x:Key="BigFontButton">
        <Triggers Property="Control.IsFocused" Value="True">
            <Setter Property="Control.Foreground" Value="DarkRed"/>

In essence, a trigger is one of many property providers that override the value returned from a dependent property. However, the original properties remain. As long as the trigger is disabled, the property values before the trigger are available again.


Behavior creation encapsulates the behavior of some common user interface functions, which can be added to another control of any program.

  • System.windows.interaction.dll - defines basic classes that support behavior.
  • Microsoft.Expression.Interactions.dll - adds some useful extensions by adding optional action and trigger classes based on the core behavior class.
public class DragInCanvasBehavior : Behavior<UIElement>
    protected override void OnAttached()
        // The element of the placement behavior is accessed through the AssociatedObject attribute, and the event handler can be associated
        this.AssociatedObject.MouseMove += M_MouseMove;
        this.AssociatedObject.MouseLeftButtonUp += M_MouseLeftButtonUp;

    protected override void OnDetaching()
        this.AssociatedObject.MouseMove -= M_MouseMove;
        this.AssociatedObject.MouseLeftButtonUp -= M_MouseLeftButtonUp;
    <Ellipse Canvas.Left="10" Canvas.Top="70">

My official account

Posted by rr1024 on Mon, 29 Nov 2021 04:17:19 -0800