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 add custom labels to RangeSlider.?

Platform: Xamarin.Forms |
Control: SfRangeSlider |
Published Date: August 26, 2016 |
Last Revised Date: August 26, 2016

To add the Custom Labels in RangeSlider, follow the given steps:


Step 1: Create the RangeSlider sample and include the necessary source files.

Step 2: Create a class and create an instance for SfRangeSlider.

Step 3: Create an observable collection which has a list of Items in it.

Step 4: Call observable collection using Add () method. Inside this method create an instance for Items with Label and Value.

Step 5: Next using RangeSlider instance, set the ShowCustomLabel property to true and set the CustomLabel property to observable collection.


public class RangeSliderPage : ContentPage
        SfRangeSlider rangeSlider
        ObservableCollection<Items>  customCollection;

        public RangeSliderPage ()
            customCollection = new ObservableCollection<Items> ();
            customCollection.Add(new Items(){Label = "Min", Value= 0});
            customCollection.Add(new Items() { Label = "Max", Value = 100 });

rangeSlider = new SfRangeSlider ();
            rangeSlider.HeightRequest = 400;
            rangeSlider.ShowCustomLabel = true;
            rangeSlider.CustomLabels = customCollection;

            this.Content = GetRangeSlider();
        private StackLayout GetRangeSlider()
            var mainStack=new StackLayout
                Children = {RangeSlider}
            return mainStack;



The following screenshot shows the RangeSlider with CustomLabel:


You must log in to leave a comment
Gonzalo Parra
Feb 27, 2019

Is there a way to display a collection of only custom labels??


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