RangeSlider support Control Templates….

Hello,

yep the title of this post says it all.. I refactored the Range slider so that now it can support control templates… so basically instead of setting all those syle (this was how you could restyle the control in the previous version), now you can just create on control template to restyle the control however you desire…

The parts you can restyle are named as follows

“PART_RangeSliderContainer” (StackPanel), this control acts as the container of all the other inner element. Please note that the oraintation for this control will always be Horizontal even if you re style, since the Range slider only supports horizontal oriantation for now….

“PART_LeftEdge” (RepeatButton), This is the left side of the range slider. (in the demo there is the text click me)

“PART_RightEdge” (RepeatButton), This is the right side of the range slider(in the demo there is the text click me)

“PART_LeftThumb” Thumb, This is the thumb on the left side. the users use this thumb to expnad/shrink the selected range

“PART_MiddleThumb” (Thumb), This is the middle part of the slider. users use this part to move the range back and forward by dragging this thumb.

“PART_RightThumb” (Thumb), This is the thumb on the right side. the users use this thumb to expnad/shrink the selected range

an example of such a control template would be something like the following

<ControlTemplate TargetType=”{x:Type local:RangeSlider}” x:Key=”rangeSliderTemplate”> <StackPanel Name=”PART_RangeSliderContainer”> <RepeatButton Name=”PART_LeftEdge” Background=”AliceBlue” Content=”click me”/> <Thumb Name=”PART_LeftThumb” Cursor=”SizeWE”/><!–This size of this thumb will auto matically change by the control to 10–> <Thumb Name=”PART_MiddleThumb” Background=”AntiqueWhite” Cursor=”ScrollAll” MinWidth=”10″/> <Thumb Name=”PART_RightThumb” Cursor=”SizeWE”/><!–This size of this thumb will auto matically change by the control to 10–> <RepeatButton Name=”PART_RightEdge” Background=”AliceBlue” Content=”click me”/> </StackPanel> </ControlTemplate>

if you have any problems please contact me on this blog or send an email at marlongrech@gmail.com

Download Source Code + Demo Project

 

 

---

Possibly related posts: (automatically generated)

• WPF Range Slider Control
• Rating Selector
• Window Control…
• Video slider control