
Here we show how to replace the thumb of the slider with an image, but you can modify the thumb or the track to any look you want.
1. Choose SimpleSlider from the Asset Library and click and drag in the artboard.
2. While the slider is selected, choose Object -> Edit Control Parts (Template) -> Edit Template.
3. Open the expander beside PART_TracK and then open the expander beside Thumb and click [Thumb] to select it.
4. Choose Object -> Edit Control Parts (Template) -> Edit Template again. This shows you the thumb only. You may need to zoom in to see it clearly.
5. Now you can delete the ellipse and add in anything you want. We inserted an image. Click the ScopeUp button, (then you may need to click your window tab to view your window.)
6. If you want to increase the size of your slider, like we did, you can group it into a Viewbox and expand the Viewbox.
7. The border around our slider is simply a rectangle.
Download the .exe file. Download the project file. View the XAML.