Content Index Search


The slider is a simple control that lets a user select from a range of values by moving a Thumb control. By default, the slider displays horizontally, but you can change it to vertical by setting the Orientation property under Common Properties in the Properties panel of Microsoft® Expression Blend™. To set the value of a slider, use the Minimum, Maximum, and Value properties.

Artboard view: SimpleSlider

The artboard view of a SimpleSlider control.

Breaking down the control template

The SimpleSlider control template consists of the following items:

Warning Do not rename any element whose name begins with "PART_" because these elements are referred to from the code that implements the control.

Objects view: The basic parts (template) of SimpleSlider

Objects view: The basic parts (template) of a SimpleSlider control.

Property triggers used

Property triggers in the control template are used to make the control react to property changes. You can click the items under Triggers in the Interaction panel to view the properties that are changed when a trigger is active. For example, in the SimpleSlider template, triggers are used to make the TickBar elements appear based on the TickPlacement property. This sets visibility on the TopTick and BottomTick elements. Horizontal and Vertical orientation are also configured in the triggers of the SimpleSlider template. This applies a layout transform on the slider that rotates it 90 degrees. Because the track automatically orientates itself, it is forced back so that it won't be rotated twice.

Brushes used

The following brush resources in the SimpleStyles.xaml resource dictionary are used by the SimpleSlider template:

Best practices and design guidelines

Try it!