Custom Controls for WPF control development (1)

The scalability of the Windows Presentation Foundation (WPF) control model greatly reduces the need to create new controls. However, in some cases, you may still need to create custom controls. This topic discusses how to minimize the functionality required to create custom controls and other controls to create models in Windows Presentation Foundation (WPF. This topic also demonstrates how to create a new control.

How to compile a new control
Previously, to get a custom experience through an existing control, you can only change the standard properties of the control, such as the background color, Border width, and font size. If you want to expand the appearance or behavior of a control based on these predefined parameters, you need to create a new control. The common method is to inherit the existing control and override the method that is responsible for drawing the control. Although this is still an optional method, you can also use WPF's rich content models, styles, templates, and triggers to customize existing controls. The following list provides examples to demonstrate how to use these features without creating new controls for a unified User-Defined experience.

Rich content.Many standard WPF Controls Support rich content. For example, the content attribute of a button is of the object type. Therefore, theoretically, any content can be displayed on the button. To display images and text with buttons, you can add images and textblocks to stackpanel and assign stackpanel to the content attribute. Since these controls can display WPF visualization elements and any data, they reduce the need to create new controls or modify existing controls to support complex visualization.

Style.Style is a set of control property values. You can use styles to create reusable representations of the appearance and behavior of the required controls without writing new controls. For example, assume that you want all textblock controls to display the red airal font with a font size of 14. You can create a style as a resource and set the appropriate attributes accordingly. In this way, each textblock added to the application will have the same appearance.

Data Template. Datatemplate can be used to customize the display mode of data on the control. For example, datatemplate can be used to specify how data is displayed in the ListBox. For examples of this situation, see Data Template overview. In addition to the custom data appearance, datatemplate can also contain UI elements, which greatly increases the flexibility of the custom UI. For example, you can use datatemplate to create a ComboBox. Each item contains a check box.

Many controls in the control template WPF use controltemplate to define the structure and appearance of the control, so that the control appearance and control functions can be separated. By redefining the controltemplate of the control, you can thoroughly change the control's appearance. For example, assume that you want the control to look like a traffic signal. This control has a simple user interface and functions. This control has three circles and can only light one of them at a time. After consideration, you may realize that radiobutton provides the function of selecting only one item at a time, but radiobutton does not look like a light on a traffic signal by default. Since radiobutton uses a control template to define its appearance, it is easy to redefine the controltemplate to meet the control's requirements, and thus use single-choice buttons to create traffic signals.

Note:
Although radiobutton can use datatemplate, it is not enough to use only datatemplate in this example. Datatemplate defines the appearance of the control content. For radiobutton, it indicates whether or not radiobutton displays all the content of the control on the right of the selected Circle. In the example of a traffic signal, a single button only needs to be a circle that can be lit. Because the appearance of traffic signals is significantly different from that of radiobutton, it is necessary to redefine the controltemplate. In general, datatemplate is used to define the content (or data) of the control, and controltemplate is used to define the composition of the control.

Trigger.Trigger is used to dynamically change the widget's appearance and behavior without creating a new control. For example, assume that the application has multiple ListBox controls, and you want the items in each ListBox to be displayed in red and bold when selected. The first thing you think of is to create a class inherited from ListBox, And Then override the onselectionchanged method to change the appearance of the selected item. However, A better way is to add a trigger to the listboxitem style to change the appearance of the selected item. A trigger is used to change the property value or perform operations based on the property value. Eventtrigger is used to perform operations when an event occurs.

In general, if the control completely copies the functions of the existing control, but you want the control to have different appearances, you should first consider whether you can use some methods discussed in this section to change the appearance of existing controls.

Control creation model
By enriching content models, styles, templates, and triggers, You can minimize the need to create new controls. However, if you do need to create a new control, it is very important to understand the different control creation models in WPF. WPF provides three general models for creating controls. Each model provides different feature sets and flexibility. The base classes of the three models are usercontrol, control, and frameworkelement.

Derived from usercontrol
The simplest way to create a control in WPF is to derive from usercontrol. If you generate a control that inherits from usercontrol, you need to add existing components to usercontrol, name these components, and then reference the event handler in the Extensible Application Markup Language (XAML. After performing these operations, you can reference these naming elements and define event handlers in the code. This development model is very similar to the model used for WPF application development.

If the generation is correct, usercontrol can take advantage of rich content, styles, and triggers. However, if the control inherits from usercontrol, users who use the control cannot use datatemplate or controltemplate to customize its appearance. Therefore, it is necessary to derive from the control class or its derived class (except usercontrol) to create custom controls that support templates.

Advantages derived from usercontrol
If all of the following conditions are met, consider deriving from usercontrol:

You want to generate a control in a way similar to generating an application.

Controls only consist of existing components.

You do not need to support complex custom items.

Derived from control
Derived from the control class is the model used by most existing WPF controls. When creating a control that inherits the control class, you can use a template to define its appearance. In this way, the computing logic can be separated from the visual representation. By using commands and binding (rather than events), you can also ensure that the UI and logic are separated to avoid referencing elements in controltemplate as much as possible. If the UI and logic of the control are correctly separated, the control user can redefine its controltemplate to customize its appearance. Although generating custom control is not as simple as generating usercontrol, custom control provides maximum flexibility.

Benefits derived from control
If any of the following conditions is met, consider deriving from control instead of using the usercontrol class:

You can use controltemplate to customize the control appearance.

You want the controls to support different themes.

Derived from frameworkelement
Controls derived from usercontrol or control depend on combining existing elements. In many cases, this is an acceptable solution because any object inherited from frameworkelement can be located in controltemplate. However, in some cases, simple element combinations cannot meet the display requirements of controls. In these cases, the correct choice is to make the component based on frameworkelement.

There are two standard methods to generate a frameworkelement-based component: Direct rendering and custom element combination. Operations involved in direct rendering include rewriting the onrender method of frameworkelement and explicitly defining drawingcontext operations for component visual effects. This method is used by image and border. Operations involved in a custom element combination include the appearance of an object Combination Component of the visual type. For examples, see use drawingvisual objects. Track is an example of a control that uses custom element combinations in WPF. In the same control, you can also use both direct rendering and custom element combinations.

Benefits derived from frameworkelement
If any of the following conditions is met, consider deriving from frameworkelement:

We hope to precisely control the appearance of the control, not just the effect provided by simple combinations of elements.

You want to define the display logic of the control.

You want to combine existing elements in a novel way other than usercontrol and control.

Basic control creation knowledge
As mentioned above, one of the most powerful functions of WPF is that you do not need to create a custom control to implement a function that is far more powerful than setting the basic properties of the control to change its appearance and behavior. The WPF property system and the WPF Event System make style, data binding, and trigger functions possible. If dependency attributes and routing events are implemented in the control, no matter which model is used to create a custom control, users of custom controls can use these functions as they do with the controls that are included with WPF.

Use dependency properties
When the property is a dependency property, you can perform the following operations:

Set this attribute in the style.

Bind the property to the data source.

Use Dynamic resources as the value of this attribute.

The animation processes this attribute.

If you want the property of the control to support any of the above functions, you should implement this property as a dependency property. The following example defines a dependency attribute.

 

This code executes the following operations:

Define a dependencyproperty identifier named valueproperty as the publicstaticreadonly field.

Call dependencyproperty...:. Register to register the property name with the Property System to specify the following content:

Attribute name.

Attribute type.

Type of the property.