Shulou(Shulou.com)06/01 Report--

It is believed that many inexperienced people do not know what the WPF control template and its trigger are like. Therefore, this paper summarizes the causes and solutions of the problem. Through this article, I hope you can solve this problem.

What is ControlTemplate?

ControlTemplate (control template) is not only used to define the appearance and style of the control, but also to modify the behavior and response animation of the control through the trigger (ControlTemplate.Triggers) of the control template.

Understand the composition of ControlTemplate by profiling the control:

First, create a WPF project, create a Button button, then select the button, right-click Edit template > Edit copy:

After the creation is completed, some style clips are generated under the current page key, a style with a key of ButtonStyle1:

You can see that this style defines some basic styles, such as background color, font color, border size, vertical and horizontal position, and so on. In addition, there is an object of Template below, which is ControlTemplate. You can see that ControlTemplate defines a Border, and then defines a control for internal rendering. ContentPresenter is mainly used to render the display content body of the button, marked as follows:

We can make some attempts to modify the properties of border and see what happens to Button. By adding a rounded rectangle parameter to Border, set the background color to a fixed value, as follows:

Through a simple attempt, you can observe that the Border acts as the edge style of the Button button and the overall appearance control.

Next, we can see how the control exists by modifying some parameters in ContentPresenter. Change the vertical position to lower, set a fixed Content value "Hello" for Button, and observe the position of Hello:

In the channel practice, you can see that the content rendering control (ContentPresenter) is responsible for the presentation of the content and the control of some properties.

What is the role of TemplateBinding in ControlTemplate?

In ControlTemplate, you can look at the code that defines TemplateBinding multiple times:

TemplateBinding can be understood as associating to a specified style or attribute through template binding. In this way, when the button sets this property through the display, it will eventually affect the property value of the Template binding.

The following code demonstrates the difference between TemplateBinding and no TemplateBinding. In the Button button, the border color of the definition button is "Blue" to see the influence of the two:

Figure (1), with TemplateBinding:

Figure (2), no TemplateBinding:

It can be understood that the main function of TemplateBinding is to relate to external attributes so that they can change style attributes.

ControlTemplate.Triggers trigger

Expand the ControlTemplate.Triggers node and you can see that some trigger conditions and styles of changes are defined in it.

As you can see, four triggers are defined, and after the conditions are met, some styles of Border are changed. Next, a diagram is used to explain the process of their influence:

Actual effect:

Similarly, other triggers also control the property changes of the control through this operation.

ControlTemplate.EventTrigger event trigger

An EventTrigger event trigger is defined below

When the mouse enters the button area, perform an animation of half a second, setting the background color of the button to pink

When the mouse leaves the button area, perform a 0.5 second animation to set the background color of the button to Green:

Actual effect:

Custom ControlTemplate

Control templates can exist independently, and in the above example, included in the style file, below, declare a separate control template:

1. Create a ControlTemplate, set a key name, and specify the type of its template

two。 Create a Border to style button edges

3. Create a content rendering control, set several parameters of the TemplateBinding.

4. The Template of the button binds the template

After reading the above, have you mastered the method of WPF control template and its trigger? If you want to learn more skills or want to know more about it, you are welcome to follow the industry information channel, thank you for reading!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.