Migrate from Xamarin.Forms SfRangeSlider to .NET MAUI SfSlider

30 Sep 20222 minutes to read

In Xamarin.Forms, the Range Slider and Slider are combined as the Xamarin Range Slider. But in MAUI, separate controls for Range Slider and Slider to make the control architecture more clear and user-friendly. In Xamarin.Forms, set the ShowRange of Range Slider to false to get a single thumb slider. But in MAUI, you have the following two controls, which will always have a single thumb.

1. SfDateTimeSlider – For date-time scale.
2. SfSlider – For numeric scale.

Namespaces

Xamarin SfRangeSlider	.NET MAUI SfSlider
Syncfusion.SfRangeSlider.XForms	Syncfusion.Maui.Sliders

Properties

Track

Xamarin SfRangeSlider	.NET MAUI SfSlider	Description
TrackColor	SliderTrackStyle.InactiveFill	Gets or sets the brush for the inactive track in the SfSlider.
TrackSelectionColor	SliderTrackStyle.ActiveFill	Gets or sets the brush for the active track in the SfSlider.
TrackThickness	SliderTrackStyle.InactiveSize	Gets or sets the size for the inactive track in the SfSlider.
TrackSelectionThickness	SliderTrackStyle.ActiveSize	Gets or sets the size for the active track in the SfSlider.

Thumb

Xamarin SfRangeSlider	.NET MAUI SfSlider	Description
ThumbSize	SliderThumbStyle.Radius	Gets or sets the radius for the thumb in the SfSlider.
KnobColor	SliderThumbStyle.Fill	Gets or sets the color for the thumb in the SfSlider.
ThumbBorderColor	SliderThumbStyle.Stroke	Gets or sets the stroke color for the thumb in the SfSlider.
ThumbBorderThickness	SliderThumbStyle.StrokeThickness	Gets or sets the stroke value for the thumb in the SfSlider.

Ticks

Xamarin SfRangeSlider	.NET MAUI SfSlider	Description
TickColor	SliderTickStyle.InactiveFill	Gets or sets the brush for the inactive ticks in the SfSlider.
	SliderTickStyle.ActiveFill	Gets or sets the brush for the active ticks in the SfSlider.

Labels

Xamarin SfRangeSlider	.NET MAUI SfSlider	Description
AllowDragRange	ShowLabels	Gets or sets a value indicating whether to show or hide the labels.
LabelColor	SliderLabelStyle.InactiveTextColor	Gets or sets the color for the inactive labels in the SfSlider.
	SliderLabelStyle.ActiveTextColor	Gets or sets the color for the active labels in the SfSlider.
FontFamily	SliderLabelStyle.InactiveFontFamily	Gets or sets the font family for the inactive labels in the SfSlider.
	SliderLabelStyle.ActiveFontFamily	Gets or sets the font family for the active labels in the SfSlider.
FontAttribute	SliderLabelStyle.InactiveFontAttributes	Gets or sets the font attributes for the inactive labels in the SfSlider.
	SliderLabelStyle.ActiveFontAttributes	Gets or sets the font attributes for the active labels in the SfSlider.
FontSize	SliderLabelStyle.InactiveFontSize	Gets or sets the size for the inactive fonts in the SfSlider.
	SliderLabelStyle.ActiveFontSize	Gets or sets the size for the active fonts in the SfSlider.
LabelFormat	NumberFormat	Gets or sets the value to format the label text.

Tooltip

Xamarin SfRangeSlider	.NET MAUI SfSlider	Description
TooltipBackgroundColor	SliderTooltip.Fill	Gets or sets the brush for the tooltip in the SfSlider.
TooltipTextColor	SliderTooltip.TextColor	Gets or sets the color for the tooltip text in the SfSlider.
TooltipPrecision	SliderTooltip.NumberFormat	Gets or sets the value to format the label text in the SfSlider.

Step

Xamarin SfRangeSlider	.NET MAUI SfSlider	Description
SnapsTo	StepSize	Gets or sets the value indicating whether to select the discrete value.

Events

Xamarin SfRangeSlider	.NET MAUI SfSlider	Description
DragStarted	ValueChangeStart	Occurs when the user selects a new value for the Slider by tapping/mouse down on the thumb.
DragCompleted	ValueChangeEnd	Occurs when the user completes selecting a new value for the Slider by tapping/mouse down on the thumb.