Applying styles to the SfRangeSlider

Hiya,

I've been trying to apply some form of styling to the RangeSlider but without much success.

Right now, I have:

```
<sfshared:SfRangeSlider
                                x:Name="range"
                                Margin="294,72,18,89"
                                LabelPlacement="BottomRight"
                                FontSize="10"
                                Maximum="30"
                                Minimum="0"
                                Orientation="Horizontal"
                                ShowCustomLabels="True"
                                ShowRange="False"
                                AllowRangeDrag="True"
                                ShowValueLabels="True"
                                SnapsTo="Ticks"
                                TickFrequency="5"
                                TickPlacement="Inline"
                                TickLength="2"
                                Value="0" />
```

I want to ideally set a style similar to the MaterialLight theme but to this control only. Any pointers would be appreciated.

Thanks in advance

Paul

3 Replies 1 reply marked as answer

SS Suganya Sethuraman Syncfusion Team August 10, 2020 08:00 AM UTC

Hi Paul,

Greetings from Syncfusion.

We have prepared a sample for your requirement. We have applied style for thumb, active track and inactive track of SfRangeSlider control to achieve your requirement. Please have the sample for your reference,


Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/RangeSliderStyle_WPF_API1028277337

Please check if the sample satisfies your requirement and if not provide additional details like pictorial representation of your requirement which will be helpful for us to provide the solution at the earliest.

Regards,
Suganya Sethuraman.
 


Marked as answer

PA Paul August 11, 2020 10:45 PM UTC

Thank you :)


SS Suganya Sethuraman Syncfusion Team August 12, 2020 05:26 AM UTC

Hi Paul,

Thanks for the update.

We are glad to know that the given solution works. Please let us know if you need any further assistance.

Regards,
Suganya Sethuraman.
 


Loader.
Up arrow icon