Migrate Xamarin.Forms SfDateTimeRangeNavigator to MAUI SfRangeSelector

2 Jun 20222 minutes to read

In Xamarin.Forms, SfDateTimeRangeNavigator control, which supports only the date-time scale. But in MAUI, separate controls for this date-time scale and numeric scale. Also, in Xamarin.Forms, the control comes along with the Syncfusion.Xamarin.SfChart package but in MAUI we have the controls that come with the Syncfusion.Maui.Sliders package. The following are the new MAUI controls for migrating from Xamarin.Forms SfDateTimeRangeNavigator to MAUI.

  1. SfDateTimeRangeSelector - For date-time scale
  2. SfRangeSelector – For numeric scale

Namespaces

Xamarin SfDateTimeRangeNavigator .NET MAUI SfDateTimeRangeSelector
Syncfusion.RangeNavigator.XForms Syncfusion.Maui.Sliders

Properties

General

Xamarin SfDateTimeRangeNavigator .NET MAUI SfDateTimeRangeSelector Description

ViewRangeStart

RangeStart

Gets or sets the thumb start value of the track. The thumb starts from this value.

ViewRangeEnd

RangeEnd

Gets or sets the thumb end value of the track. The thumb ends in this value.

Intervals

IntervalType

Gets or sets the type of the date interval. By default, it will be Years.

OverlayColor

InactiveRegionFill

Gets or sets the color to the InactiveRegionColor.

LeftThumbStyle

ThumbStyle


Gets or sets a value to customize the appearance of the thumb shape.

RightThumbStyle

LeftTooltipStyle

Tooltip


Gets or sets a value to customize the appearance of the tooltip shape.

RightTooltipStyle

Thumb

Xamarin SfDateTimeRangeNavigator .NET MAUI SfDateTimeRangeSelector Description

ThumbStyle.Width

SliderThumbStyle.Radius


Gets or sets the radius for the thumb.

ThumbStyle.Height

ThumbStyle.BackgroundColor

SliderThumbStyle.Fill

Gets or sets the color for the thumb.

ThumbStyle.BorderColor

SliderThumbStyle.Stroke

Gets or sets the stroke color for the thumb.

ThumbStyle.BorderWidth

SliderThumbStyle.StrokeThickness

Gets or sets the stroke value for the thumb.

Ticks

Xamarin SfDateTimeRangeNavigator .NET MAUI SfDateTimeRangeSelector Description

ScaleStyle.TickLineColor


SliderTickStyle.ActiveFill

Gets or sets the brush for the active ticks.

SliderTickStyle.InactiveFill

Gets or sets the brush for the inactive ticks.

ScaleStyle.TickLineWidth


SliderTickStyle.ActiveSize

Gets or sets the size for the active ticks.

SliderTickStyle.InactiveSize

Gets or sets the size for the inactive ticks.

Labels

Xamarin SfDateTimeRangeNavigator .NET MAUI SfDateTimeRangeSelector Description

ScaleStyle.IsVisible

ShowLabels

Gets or sets a value indicating whether to show or hide the labels.

ScaleStyle.LabelTextColor

SliderLabelStyle.InactiveTextColor

Gets or sets the color for the inactive labels.

ScaleStyle.SelectedLabelTextColor

SliderLabelStyle.ActiveTextColor

Gets or sets the color for the active labels.

ScaleStyle.LabelFontFamily

SliderLabelStyle.InactiveFontFamily

Gets or sets the font family for the inactive labels.

ScaleStyle.SelectedLabelFontFamily

SliderLabelStyle.ActiveFontFamily

Gets or sets the font family for the active labels.

ScaleStyle.LabelFontAttribute

SliderLabelStyle.InactiveFontAttributes

Gets or sets the font attributes for the inactive labels.

ScaleStyle.SelectedLabelFontAttribute

SliderLabelStyle.ActiveFontAttributes

Gets or sets the font attributes for the active labels.

ScaleStyle.LabelFontSize

SliderLabelStyle.InactiveFontSize

Gets or sets the size for the inactive font.

ScaleStyle.SelectedLabelFontSize

SliderLabelStyle.ActiveFontSize

Gets or sets the size for the active font.

Tooltip

Xamarin SfDateTimeRangeNavigator .NET MAUI SfDateTimeRangeSelector Description

TooltipStyle.BackgroundColor

SliderTooltip.Fill

Gets or sets the brush for the tooltip.

TooltipStyle.TextColor

SliderTooltip.TextColor

Gets or sets the color for the tooltip text.

TooltipStyle.BorderColor

SliderTooltip.Stroke

Gets or sets the brush for the tooltip stroke.

TooltipStyle.BorderWidth

SliderTooltip.StrokeThickness

Gets or sets the stroke size for tooltip.

TooltipStyle.FontSize

SliderTooltip.FontSize

Gets or sets the font size for tooltip text.

TooltipStyle.FontFamily

SliderTooltip.FontFamily

Gets or sets the font family for tooltip text.

TooltipStyle.FontAttributes

SliderTooltip.FontAttributes

Gets or sets the font attributes for tooltip text.

Events

Xamarin SfDateTimeRangeNavigator .NET MAUI SfDateTimeRangeSelector Description

MinorScaleLabelsCreated

LabelCreated

It occurs when a label is created. It is used to format or change the label text.

RangeChanged

ValueChanged

It occurs when the user is done selecting a new value for the DateTime Range Selector.