Major and Minor Scales in Xamarin.Android RangeNavigator

30 Nov 20224 minutes to read

SfDateTimeRangeNavigator displays major and minor scales at the top and bottom position of the control. You can also control its visibility using MajorScaleStyle.Visible and MinorScaleStyle.Visible properties.


By default, best possible interval component will be chosen for both major and minor scales based on the available size of the view. For example, if the available space is sufficient to show only year labels without overlapping, interval will be displayed in years. However, you can also set specific DateTimeIntervalType components using Intervals property as demonstrated in the below code snippet.

  • C#
  • [C#]
    SfDateTimeRangeNavigator dateTime = new SfDateTimeRangeNavigator(this);
    dateTime.Intervals = EnumSet.Of(DateTimeIntervalType.Year, DateTimeIntervalType.Month);

    Interval support for major and minor scales in Xamarin.Android DateTimeRangeNavigator

    Appearance Customization

    The MajorScaleStyle and MinorScaleStyle properties of SfDateTimeRangeNavigator are used to customize the appearance of ticks and labels.

  • C#
  • [C#]
    SfDateTimeRangeNavigator dateTime = new SfDateTimeRangeNavigator();
    dateTime.MajorScaleStyle.Position = ScalePosition.Inside;
    dateTime.MajorScaleStyle.LabelTextColor = Color.Black;
    dateTime.MajorScaleStyle.LabelMarginLeft = 15;
    dateTime.MajorScaleStyle.LabelMarginTop = 15;
    dateTime.MajorScaleStyle.LabelMarginRight = 15;
    dateTime.MajorScaleStyle.LabelMarginBottom = 15;
    dateTime.MajorScaleStyle.LabelTextSize = 20;
    dateTime.MajorScaleStyle.LabelAlignment = LabelAlignment.Right;
    dateTime.MajorScaleStyle.SelectedLabelTextColor = Color.Red;
    dateTime.MajorScaleStyle.SelectedLabelMarginLeft = 15;
    dateTime.MajorScaleStyle.SelectedLabelMarginTop = 15;
    dateTime.MajorScaleStyle.SelectedLabelMarginRight = 15;
    dateTime.MajorScaleStyle.SelectedLabelMarginBottom = 15;
    dateTime.MajorScaleStyle.SelectedLabelTextSize = 20;
    dateTime.MinorScaleStyle.Position = ScalePosition.Inside;
    dateTime.MinorScaleStyle.LabelTextColor = Color.Black;
    dateTime.MinorScaleStyle.LabelMarginLeft = 15;
    dateTime.MinorScaleStyle.LabelMarginTop = 15;
    dateTime.MinorScaleStyle.LabelMarginRight = 15;
    dateTime.MinorScaleStyle.LabelMarginBottom = 15;
    dateTime.MinorScaleStyle.LabelTextSize = 20;
    dateTime.MinorScaleStyle.LabelAlignment = LabelAlignment.Left;
    dateTime.MinorScaleStyle.SelectedLabelTextColor = Color.Blue;
    dateTime.MinorScaleStyle.SelectedLabelMarginLeft = 15;
    dateTime.MinorScaleStyle.SelectedLabelMarginTop = 15;
    dateTime.MinorScaleStyle.SelectedLabelMarginRight = 15;
    dateTime.MinorScaleStyle.SelectedLabelMarginBottom = 15;
    dateTime.MinorScaleStyle.SelectedLabelFontSize = 20;

    Customizing the appearance of ticks and labels in Xamarin.Android DateTimeRangeNavigator



    The MajorScaleLabelsCreate event is triggered when the major scale label is created. The argument contains MajorScaleLabels of RangeNavigatorLabel which contains following properties:


    The MinorScaleLabelsCreate event is triggered when the minor scale label is created. The argument contains MinorScaleLabels of RangeNavigatorLabel which contains following properties: