About visual state management in Silverlight 2 Part1

Overview

The control templates in WPF and Silverlight support the perception of the custom control, the appearance, the visual effect of the accusation, and the sense of responsiveness of the control interaction, such as the change in state of pressing the mouse on the control, the control gaining focus, and so on. Microsoft introduced a new concept visual state Manager in Silverlight 2 Beta 2, providing a great convenience for us to create interactive control templates. Next I'll use a few articles to introduce the visual state management in Silverlight 2.

When defining controls, we need to strictly distinguish between the visual effects of controls and the logic of controls, so that when we modify the appearance of a control, the control logic is not affected. The part and state model presented in Silverlight 2 Beta 2 is a good solution to this problem, so let's look at some basic concepts first.

Parts (Parts)

The so-called part (Parts) refers to the elements in the space template, control logic will control these parts to complete some specific controls, but it does not care about the visual effects of these parts, as shown in the following figure for a Silder control:

The Silder control in the previous figure consists of four parts: a thumb control named Horizontalthumb, a RepeatButton control named Horizontallargechangeincrease, A RepeatButton control named Horizontallargechangedecrease, a FrameworkElement element named Horizontaltemplate. These elements will be controlled in the control logic, such as when the slider moves to the right when the horizontallargechangeincrease is pressed, and the slider moves to the left when the horizontallargechangedecrease is pressed.

It is important to note that not all controls have parts, some controls may not have parts, and you can check the Silverlight 2 SDK.

Visual state (Visual States)

Visual state is a series of states such as mouseover, pressed, etc. defined by the accusation, which represents the control in a particular logical state. Some visual states of the CheckBox control defined in the following picture: