public class SfRangeSlider : RangeSliderBase<double>, IDrawableLayout, IDrawable, IAbsoluteLayout, ILayout, IView, IElement, ITransform, IContainer, IList<IView>, ICollection<IView>, IEnumerable<IView>, IEnumerable, ISafeAreaView, IPadding, ICrossPlatformLayout, IVisualTreeElement, ISemanticsProvider, ITouchListener, ITapGestureListener, IPanGestureListener, IGestureListener, IInteractionState, IRangeView<double>, INumericElement, IOrientationElement, IParentThemeElement, IThemeElement

Constructors

SfRangeSlider()

Initializes a new instance of the SfRangeSlider class.

Declaration

public SfRangeSlider()

Fields

LabelTemplateProperty

The backing store for the LabelTemplate field.

Declaration

public static readonly BindableProperty LabelTemplateProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	Microsoft.Maui.Controls.BindableProperty.

NumberFormatProperty

The backing store for the NumberFormat field.

Declaration

public static readonly BindableProperty NumberFormatProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	Microsoft.Maui.Controls.BindableProperty.

OrientationProperty

The backing store for the Orientation field.

Declaration

public static readonly BindableProperty OrientationProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	Microsoft.Maui.Controls.BindableProperty.

StepSizeProperty

The backing store for the StepSize field.

Declaration

public static readonly BindableProperty StepSizeProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	Microsoft.Maui.Controls.BindableProperty.

Properties

LabelTemplate

Gets or sets the Microsoft.Maui.Controls.DataTemplate used to customize the visual representation of labels displayed in the SfRangeSlider.

Declaration

public DataTemplate LabelTemplate { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.DataTemplate	A Microsoft.Maui.Controls.DataTemplate that defines the visual representation of each range slider label.

Remarks

When a template is provided, range slider labels are generated using the specified template instead of the default text-based rendering. The binding context for each template instance is a SliderLabelInfo object, which provides information about the corresponding label. This property is applicable only when ShowLabels is set to true.

If this property is null, range slider labels are displayed using the default label presentation.

Examples

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider ShowLabels="True">
    <sliders:SfRangeSlider.LabelTemplate>
        <DataTemplate>
            <Label Text="{Binding Text}" FontSize="12" />
        </DataTemplate>
    </sliders:SfRangeSlider.LabelTemplate>
</sliders:SfRangeSlider>

SfRangeSlider rangeSlider = new SfRangeSlider() { ShowLabels = true };
rangeSlider.LabelTemplate = new DataTemplate(() => 
{
    var label = new Label { FontSize = 12 };
    label.SetBinding(Label.TextProperty, new Binding("Text"));
    return label;
});

NumberFormat

Gets or sets the value to format the label text.

Declaration

public string NumberFormat { get; set; }

Property Value

Type	Description
System.String	Defaults to `0.##`.

Examples

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider ShowLabels = "True"
                       NumberFormat = "0.0" />

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ShowLabels = true,
    NumberFormat = "0.0",
};

Orientation

Gets or sets the orientation of the RangeSlider.

If you set this property to Horizontal, the slider will be render from left to right. If you set this property to Vertical, the slider will be render from bottom to top.

Declaration

public SliderOrientation Orientation { get; set; }

Property Value

Type	Description
SliderOrientation	Defaults to `Horizontal`.

Examples

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider Orientation = "Vertical" />

SfRangeSlider slider = new SfRangeSlider()
{
    Orientation = SliderOrientation.Vertical
};

StepSize

Gets or sets the value indicating whether to select the discrete value.

For example, if Minimum is 0.0 and Maximum is 10.0 and StepSize is 2.0, then the slider will move the thumb positions to 0.0, 2.0, 4.0, 6.0, 8.0 and 10.0 only.

Declaration

public double StepSize { get; set; }

Property Value

Type	Description
System.Double	Defaults to `0d`.

Remarks

StepSize does not work with BetweenThumbs.

Examples

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider Minimum="0"
                       Maximum="10" 
                       StepSize="2">
</sliders:SfRangeSlider>

SfRangeSlider rangeSlider = new SfRangeSlider()
{ 
     Minimum = 0,
     Maximum = 10,
     StepSize = 2
};

Events

ValueChanged

Represents the ValueChanged event, which occurs when the user is done selecting a new value for the Range Slider.

Declaration

public event EventHandler<RangeSliderValueChangedEventArgs> ValueChanged

Event Type

Type
System.EventHandler<RangeSliderValueChangedEventArgs>

<sliders:SfRangeSlider ValueChanged="OnValueChanged" />

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ValueChanged += OnValueChanged
}

private void OnValueChanged(object sender, RangeSliderValueChangedEventArgs e)
{
}

ValueChanging

Represents the ValueChanging event, which occurs when the user is selecting a new value for the Range Slider by dragging any one of the thumb.

Declaration

public event EventHandler<RangeSliderValueChangingEventArgs> ValueChanging

Event Type

Type
System.EventHandler<RangeSliderValueChangingEventArgs>

Examples

XAML
C#

<sliders:SfRangeSlider ValueChanging="OnValueChanging" />

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ValueChanging += OnValueChanging
}

private void OnValueChanging(object sender, RangeSliderValueChangingEventArgs e)
{
}

Explicit Interface Implementations

INumericElement.OnLabelTemplateChanged()

Clears all generated label template views and refreshes the control layout when the LabelTemplate property changes.

Declaration

void INumericElement.OnLabelTemplateChanged()

INumericElement.OnNumberFormatChanged(String, String)

Declaration

void INumericElement.OnNumberFormatChanged(string oldValue, string newValue)

Parameters

Type	Name	Description
System.String	oldValue
System.String	newValue

INumericElement.OnStepChanged()

Declaration

void INumericElement.OnStepChanged()

IOrientationElement.OnOrientationChanged(SliderOrientation)

Declaration

void IOrientationElement.OnOrientationChanged(SliderOrientation newValue)

Parameters

Type	Name	Description
SliderOrientation	newValue

Implements

IDrawableLayout

Microsoft.Maui.Graphics.IDrawable

Microsoft.Maui.IAbsoluteLayout

Microsoft.Maui.ILayout

Microsoft.Maui.IView

Microsoft.Maui.IElement

Microsoft.Maui.ITransform

Microsoft.Maui.IContainer

System.Collections.Generic.IList<>

System.Collections.Generic.ICollection<>

System.Collections.Generic.IEnumerable<>

System.Collections.IEnumerable

Microsoft.Maui.ISafeAreaView

Microsoft.Maui.IPadding

Microsoft.Maui.ICrossPlatformLayout

Microsoft.Maui.IVisualTreeElement

INumericElement

IOrientationElement