Article information
Article relates to
RadControls for Silverlight
Created by
Kiril Stanoev
Last modified
August, 25, 2008
Last modified by
Note: In this particular project the test page is generated dynamically, but you are free to attach a website.
2. Once the project is loaded, add a reference to the Telerik.Windows.Controls.dll
3. Open Page.xaml and add an xmlns referencing the previously added dll.
1: xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"
Build the project and you are ready to open Page.xaml in Expression Blend.
4. When Blend loads, click the “Asset Library” button, choose the “Custom Controls” tab and then select RadSlider from the list.
5. Add RadSlider to the page (can be done in two ways):
5.1 Double-click the icon to insert RadSlider
5.2 Switch to XAML view and add RadSlider declaratively.
1: <Grid x:Name="LayoutRoot" Background="White">
2:
3: <telerik:RadSlider />
4:
5: </Grid>
Currently Blend is not able to find the ControlTemplate of the control, so if you decide to right click and select “Edit Control Parts (Template)” > “Edit a Copy”, you will get a ControlTemplate with nothing inside.
Therefore you need to manually insert the theme in the resources of the page.
6. From the zip archive, open Slider.xaml, copy everything that is inside the UserControl.Resources and paste it in the Resources of your UserControl.
7. RadSlider’s ControlTemplate uses the Visual State Manager, therefore you need to add a reference to the System.Windows.dll in order to use it.
1: xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
We are approaching the finish line. Now you need to apply the style that you added in the resources to the slider.
8. Expand the style that targets RadSlider and add a key to it as shown in the screen shot bellow.
9. Apply the style to the slider, again can be done in two ways.
9.1 Apply the style using Blend
9.2 Declaratively
3: <telerik:RadSlider Style="{StaticResource SliderStyle}" />
10. With all the steps completed so far, you can easily edit the template of the slider.
Source code for this tutorial: StylingSlider
Additional Resources:
Articles on Visual State Manager
Using ControlTemplates
Any comments and suggestions would be greatly appreciated.
Resources Buy Try