We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to customise the Track and Knob of SfRangeSlider

Platform: Xamarin.Forms |
Control: SfRangeSlider |
Published Date: April 24, 2017 |
Last Revised Date: June 13, 2017

Syncfusion RangeSlider provides support to customize the Track and Knob.

 

To set the color for Track:

 

Step 1: Set desired color for TrackColor.

Step 2: The Track will be displayed in the color given for TrackColor.

 

To set the color for TrackSelection:

 

Step 1: Set desired color for TrackSelectionColor.

Step 2: Selected range in the track will be displayed in the color given for TrackSelectionColor.

 

To set the color for Knob:

 

Step 1: Set desired color for KnobColor.

Step 2: Knob will be displayed in the color given for KnobColor.

 

The below code illustrates the way to achieve this

 

XAML code to set color for Track, TrackSelection and Knob:

 

 

C# code to set color for Track, TrackSelection and Knob:

 

 

 

Image after setting Track color:

 

Image after setting TrackSelection color:

Image after setting Knob color:

 

 

 

 

ADD COMMENT
You must log in to leave a comment
Comments
Achmad Yusuf
Jan 09, 2019

Can i custom Knob with image or i need just remove shadow ?

Reply

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon