Class SliderLabelStyle

Options to customize the slider labels.

Inheritance

System.Object

SliderLabelStyle

Namespace: Syncfusion.Maui.Sliders

Assembly: Syncfusion.Maui.Sliders.dll

Syntax

public class SliderLabelStyle : BindableObject

Constructors

SliderLabelStyle()

Initializes a new instance of the SliderLabelStyle class.

Declaration

public SliderLabelStyle()

Fields

ActiveFontAttributesProperty

The backing store for the ActiveFontAttributes field.

Declaration

public static readonly BindableProperty ActiveFontAttributesProperty

Field Value

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

ActiveFontFamilyProperty

The backing store for the ActiveFontFamily field.

Declaration

public static readonly BindableProperty ActiveFontFamilyProperty

Field Value

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

ActiveFontSizeProperty

The backing store for the ActiveFontSize field.

Declaration

public static readonly BindableProperty ActiveFontSizeProperty

Field Value

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

ActiveTextColorProperty

The backing store for the ActiveTextColor field.

Declaration

public static readonly BindableProperty ActiveTextColorProperty

Field Value

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

InactiveFontAttributesProperty

The backing store for the InactiveFontAttributes field.

Declaration

public static readonly BindableProperty InactiveFontAttributesProperty

Field Value

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

InactiveFontFamilyProperty

The backing store for the InactiveFontFamily field.

Declaration

public static readonly BindableProperty InactiveFontFamilyProperty

Field Value

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

InactiveFontSizeProperty

The backing store for the InactiveFontSize field.

Declaration

public static readonly BindableProperty InactiveFontSizeProperty

Field Value

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

InactiveTextColorProperty

The backing store for the InactiveTextColor field.

Declaration

public static readonly BindableProperty InactiveTextColorProperty

Field Value

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

OffsetProperty

The backing store for the Offset field.

Declaration

public static readonly BindableProperty OffsetProperty

Field Value

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

Properties

ActiveFontAttributes

Gets or sets the font attributes for the active labels in the SfSlider, SfRangeSlider, SfRangeSelector,
SfDateTimeSlider, SfDateTimeRangeSlider and SfDateTimeRangeSelector.

Declaration

public FontAttributes ActiveFontAttributes { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.FontAttributes	The default color is `FontAttributes.None`.

Examples

Snippet for SfSlider

XAML
C#

<sliders:SfSlider Interval = "0.2"
                  ShowLabels = "True">
    <sliders:SfSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontAttributes = "Italic" />
    </sliders:SfSlider.LabelStyle>
</sliders:SfSlider>

SfSlider slider = new SfSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.ActiveFontAttributes = FontAttributes.Italic;

Snippet for SfDateTimeSlider

XAML
C#

<sliders:SfDateTimeSlider Interval = "0.2"
                          ShowLabels = "True">
    <sliders:SfDateTimeSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontAttributes = "Italic" />
    </sliders:SfDateTimeSlider.LabelStyle>
</sliders:SfDateTimeSlider>

SfDateTimeSlider slider = new SfDateTimeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.ActiveFontAttributes = FontAttributes.Italic;

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider Interval = "0.2"
                       ShowLabels = "True">
    <sliders:SfRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontAttributes = "Italic" />
    </sliders:SfRangeSlider.LabelStyle>
</sliders:SfRangeSlider>

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.ActiveFontAttributes = FontAttributes.Italic;

Snippet for SfDateTimeRangeSlider

XAML
C#

<sliders:SfDateTimeRangeSlider Interval = "0.2"
                               ShowLabels = "True">
    <sliders:SfDateTimeRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontAttributes = "Italic" />
    </sliders:SfDateTimeRangeSlider.LabelStyle>
</sliders:SfDateTimeRangeSlider>

SfDateTimeRangeSlider rangeSlider = new SfDateTimeRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.ActiveFontAttributes = FontAttributes.Italic;

Snippet for SfRangeSelector

XAML
C#

<sliders:SfRangeSelector Interval="0.2"
                         ShowLabels="True">
    <sliders:SfRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontAttributes="Italic" />
    </sliders:SfRangeSelector.LabelStyle>
</sliders:SfRangeSelector>

SfRangeSelector rangeSelector = new SfRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.ActiveFontAttributes = FontAttributes.Italic;

Snippet for SfDateTimeRangeSelector

XAML
C#

<sliders:SfDateTimeRangeSelector Interval="0.2"
                                 ShowLabels="True">
    <sliders:SfDateTimeRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontAttributes="Italic" />
    </sliders:SfDateTimeRangeSelector.LabelStyle>
</sliders:SfDateTimeRangeSelector>

SfDateTimeRangeSelector rangeSelector = new SfDateTimeRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.ActiveFontAttributes = FontAttributes.Italic;

ActiveFontFamily

Gets or sets the font family for the active labels in the SfSlider, SfRangeSlider, SfRangeSelector,
SfDateTimeSlider, SfDateTimeRangeSlider and SfDateTimeRangeSelector.

Declaration

public string ActiveFontFamily { get; set; }

Property Value

Type	Description
System.String	The default color is `string.Empty`.

Examples

Snippet for SfSlider

XAML
C#

<sliders:SfSlider Interval = "0.2"
                  ShowLabels = "True">
    <sliders:SfSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontFamily = "Lobster" />
    </sliders:SfSlider.LabelStyle>
</sliders:SfSlider>

SfSlider slider = new SfSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.ActiveFontFamily = "Lobster";

Snippet for SfDateTimeSlider

XAML
C#

<sliders:SfDateTimeSlider Interval = "0.2"
                          ShowLabels = "True">
    <sliders:SfDateTimeSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontFamily = "Lobster" />
    </sliders:SfDateTimeSlider.LabelStyle>
</sliders:SfDateTimeSlider>

SfDateTimeSlider slider = new SfDateTimeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.ActiveFontFamily = "Lobster";

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider Interval = "0.2"
                       ShowLabels = "True">
    <sliders:SfRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontFamily = "Lobster" />
    </sliders:SfRangeSlider.LabelStyle>
</sliders:SfRangeSlider>

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.ActiveFontFamily = "Lobster";

Snippet for SfDateTimeRangeSlider

XAML
C#

<sliders:SfDateTimeRangeSlider Interval = "0.2"
                               ShowLabels = "True">
    <sliders:SfDateTimeRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontFamily = "Lobster" />
    </sliders:SfDateTimeRangeSlider.LabelStyle>
</sliders:SfDateTimeRangeSlider>

SfDateTimeRangeSlider rangeSlider = new SfDateTimeRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.ActiveFontFamily = "Lobster";

Snippet for SfRangeSelector

XAML
C#

<sliders:SfRangeSelector Interval="0.2"
                         ShowLabels="True">
    <sliders:SfRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontFamily="Lobster" />
    </sliders:SfRangeSelector.LabelStyle>
</sliders:SfRangeSelector>

SfRangeSelector rangeSelector = new SfRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.ActiveFontFamily = "Lobster";

Snippet for SfDateTimeRangeSelector

XAML
C#

<sliders:SfDateTimeRangeSelector Interval="0.2"
                                 ShowLabels="True">
    <sliders:SfDateTimeRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontFamily="Lobster" />
    </sliders:SfDateTimeRangeSelector.LabelStyle>
</sliders:SfDateTimeRangeSelector>

SfDateTimeRangeSelector rangeSelector = new SfDateTimeRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.ActiveFontFamily = "Lobster";

ActiveFontSize

Gets or sets the size for the active fonts in the SfSlider, SfRangeSlider, SfRangeSelector,
SfDateTimeSlider, SfDateTimeRangeSlider and SfDateTimeRangeSelector.

Declaration

public double ActiveFontSize { get; set; }

Property Value

Type	Description
System.Double	The default size is `14.0`.

Examples

Snippet for SfSlider

XAML
C#

<sliders:SfSlider Interval = "0.2"
                  ShowLabels = "True">
    <sliders:SfSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontSize = "18" />
    </sliders:SfSlider.LabelStyle>
</sliders:SfSlider>

SfSlider slider = new SfSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.ActiveFontSize = 18;

Snippet for SfDateTimeSlider

XAML
C#

<sliders:SfDateTimeSlider Interval = "0.2"
                          ShowLabels = "True">
    <sliders:SfDateTimeSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontSize = "18" />
    </sliders:SfDateTimeSlider.LabelStyle>
</sliders:SfDateTimeSlider>

SfDateTimeSlider slider = new SfDateTimeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.ActiveFontSize = 18;

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider Interval = "0.2"
                       ShowLabels = "True">
    <sliders:SfRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontSize = "18" />
    </sliders:SfRangeSlider.LabelStyle>
</sliders:SfRangeSlider>

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.ActiveFontSize = 18;

Snippet for SfDateTimeRangeSlider

XAML
C#

<sliders:SfDateTimeRangeSlider Interval = "0.2"
                               ShowLabels = "True">
    <sliders:SfDateTimeRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontSize = "18" />
    </sliders:SfDateTimeRangeSlider.LabelStyle>
</sliders:SfDateTimeRangeSlider>

SfDateTimeRangeSlider rangeSlider = new SfDateTimeRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.ActiveFontSize = 18;

Snippet for SfRangeSelector

XAML
C#

<sliders:SfRangeSelector Interval="0.2"
                         ShowLabels="True">
    <sliders:SfRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontSize="18" />
    </sliders:SfRangeSelector.LabelStyle>
</sliders:SfRangeSelector>

SfRangeSelector rangeSelector = new SfRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.ActiveFontSize = 18;

Snippet for SfDateTimeRangeSelector

XAML
C#

<sliders:SfDateTimeRangeSelector Interval="0.2"
                                 ShowLabels="True">
    <sliders:SfDateTimeRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle ActiveFontSize="18" />
    </sliders:SfDateTimeRangeSelector.LabelStyle>
</sliders:SfDateTimeRangeSelector>

SfDateTimeRangeSelector rangeSelector = new SfDateTimeRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.ActiveFontSize = 18;

ActiveTextColor

Gets or sets the color for the active labels in the SfSlider, SfRangeSlider, SfRangeSelector,
SfDateTimeSlider, SfDateTimeRangeSlider and SfDateTimeRangeSelector.

Declaration

public Color ActiveTextColor { get; set; }

Property Value

Type	Description
Microsoft.Maui.Graphics.Color	The default color is `Color.FromRgba(0, 0, 0, 0.87)`.

Examples

Snippet for SfSlider

XAML
C#

<sliders:SfSlider Interval = "0.2"
                  ShowLabels = "True">
    <sliders:SfSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveTextColor = "Red" />
    </sliders:SfSlider.LabelStyle>
</sliders:SfSlider>

SfSlider slider = new SfSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.ActiveTextColor = Colors.Red;

Snippet for SfDateTimeSlider

XAML
C#

<sliders:SfDateTimeSlider Interval = "0.2"
                          ShowLabels = "True">
    <sliders:SfSfDateTimeSliderSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveTextColor = "Red" />
    </sliders:SfDateTimeSlider.LabelStyle>
</sliders:SfDateTimeSlider>

SfDateTimeSlider slider = new SfDateTimeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.ActiveTextColor = Colors.Red;

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider Interval = "0.2"
                       ShowLabels = "True">
    <sliders:SfRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveTextColor = "Red" />
    </sliders:SfRangeSlider.LabelStyle>
</sliders:SfRangeSlider>

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.ActiveTextColor = Colors.Red;

Snippet for SfDateTimeRangeSlider

XAML
C#

<sliders:SfDateTimeRangeSlider Interval = "0.2"
                               ShowLabels = "True">
    <sliders:SfDateTimeRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle ActiveTextColor = "Red" />
    </sliders:SfDateTimeRangeSlider.LabelStyle>
</sliders:SfDateTimeRangeSlider>

SfDateTimeRangeSlider rangeSlider = new SfDateTimeRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.ActiveTextColor = Colors.Red;

Snippet for SfRangeSelector

XAML
C#

<sliders:SfRangeSelector Interval="0.2"
                         ShowLabels="True">
    <sliders:SfRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle ActiveTextColor="Red" />
    </sliders:SfRangeSelector.LabelStyle>
</sliders:SfRangeSelector>

SfRangeSelector rangeSelector = new SfRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.ActiveTextColor = Colors.Red;

Snippet for SfDateTimeRangeSelector

XAML
C#

<sliders:SfDateTimeRangeSelector Interval="0.2"
                                 ShowLabels="True">
    <sliders:SfDateTimeRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle ActiveTextColor="Red" />
    </sliders:SfDateTimeRangeSelector.LabelStyle>
</sliders:SfDateTimeRangeSelector>

SfDateTimeRangeSelector rangeSelector = new SfDateTimeRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.ActiveTextColor = Colors.Red;

InactiveFontAttributes

Gets or sets the font attributes for the inactive labels in the SfSlider, SfRangeSlider, SfRangeSelector,
SfDateTimeSlider, SfDateTimeRangeSlider and SfDateTimeRangeSelector.

Declaration

public FontAttributes InactiveFontAttributes { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.FontAttributes	The default color is `FontAttributes.None`.

Examples

Snippet for SfSlider

XAML
C#

<sliders:SfSlider Interval = "0.2"
                  ShowLabels = "True">
    <sliders:SfSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontAttributes = "Italic" />
    </sliders:SfSlider.LabelStyle>
</sliders:SfSlider>

SfSlider slider = new SfSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.InactiveFontAttributes = FontAttributes.Italic;

Snippet for SfDateTimeSlider

XAML
C#

<sliders:SfDateTimeSlider Interval = "0.2"
                          ShowLabels = "True">
    <sliders:SfDateTimeSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontAttributes = "Italic" />
    </sliders:SfDateTimeSlider.LabelStyle>
</sliders:SfDateTimeSlider>

SfDateTimeSlider slider = new SfDateTimeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.InactiveFontAttributes = FontAttributes.Italic;

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider Interval = "0.2"
                       ShowLabels = "True">
    <sliders:SfRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontAttributes = "Italic" />
    </sliders:SfRangeSlider.LabelStyle>
</sliders:SfRangeSlider>

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.InactiveFontAttributes = FontAttributes.Italic;

Snippet for SfDateTimeRangeSlider

XAML
C#

<sliders:SfDateTimeRangeSlider Interval = "0.2"
                       ShowLabels = "True">
    <sliders:SfDateTimeRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontAttributes = "Italic" />
    </sliders:SfDateTimeRangeSlider.LabelStyle>
</sliders:SfDateTimeRangeSlider>

SfDateTimeRangeSlider rangeSlider = new SfDateTimeRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.InactiveFontAttributes = FontAttributes.Italic;

Snippet for SfRangeSelector

XAML
C#

<sliders:SfRangeSelector Interval="0.2"
                         ShowLabels="True">
    <sliders:SfRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontAttributes="Italic" />
    </sliders:SfRangeSelector.LabelStyle>
</sliders:SfRangeSelector>

SfRangeSelector rangeSelector = new SfRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.InactiveFontAttributes = FontAttributes.Italic;

Snippet for SfDateTimeRangeSelector

XAML
C#

<sliders:SfDateTimeRangeSelector Interval="0.2"
                                 ShowLabels="True">
    <sliders:SfDateTimeRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontAttributes="Italic" />
    </sliders:SfDateTimeRangeSelector.LabelStyle>
</sliders:SfDateTimeRangeSelector>

SfDateTimeRangeSelector rangeSelector = new SfDateTimeRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.InactiveFontAttributes = FontAttributes.Italic;

InactiveFontFamily

Gets or sets the font family for the inactive labels in the SfSlider, SfRangeSlider, SfRangeSelector,
SfDateTimeSlider, SfDateTimeRangeSlider and SfDateTimeRangeSelector.

Declaration

public string InactiveFontFamily { get; set; }

Property Value

Type	Description
System.String	The default color is `string.Empty`.

Examples

Snippet for SfSlider

XAML
C#

<sliders:SfSlider Interval = "0.2"
                  ShowLabels = "True">
    <sliders:SfSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontFamily = "Lobster" />
    </sliders:SfSlider.LabelStyle>
</sliders:SfSlider>

SfSlider slider = new SfSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.InactiveFontFamily = "Lobster";

Snippet for SfDateTimeSlider

XAML
C#

<sliders:SfDateTimeSlider Interval = "0.2"
                          ShowLabels = "True">
    <sliders:SfDateTimeSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontFamily = "Lobster" />
    </sliders:SfDateTimeSlider.LabelStyle>
</sliders:SfDateTimeSlider>

SfDateTimeSlider slider = new SfDateTimeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.InactiveFontFamily = "Lobster";

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider Interval = "0.2"
                       ShowLabels = "True">
    <sliders:SfRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontFamily = "Lobster" />
    </sliders:SfRangeSlider.LabelStyle>
</sliders:SfRangeSlider>

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.InactiveFontFamily = "Lobster";

Snippet for SfDateTimeRangeSlider

XAML
C#

<sliders:SfDateTimeRangeSlider Interval = "0.2"
                               ShowLabels = "True">
    <sliders:SfDateTimeRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontFamily = "Lobster" />
    </sliders:SfDateTimeRangeSlider.LabelStyle>
</sliders:SfDateTimeRangeSlider>

SfDateTimeRangeSlider rangeSlider = new SfDateTimeRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.InactiveFontFamily = "Lobster";

Snippet for SfRangeSelector

XAML
C#

<sliders:SfRangeSelector Interval="0.2"
                         ShowLabels="True">
    <sliders:SfRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontFamily="Lobster" />
    </sliders:SfRangeSelector.LabelStyle>
</sliders:SfRangeSelector>

SfRangeSelector rangeSelector = new SfRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.InactiveFontFamily = "Lobster";

Snippet for SfDateTimeRangeSelector

XAML
C#

<sliders:SfDateTimeRangeSelector Interval="0.2"
                                 ShowLabels="True">
    <sliders:SfDateTimeRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontFamily="Lobster" />
    </sliders:SfDateTimeRangeSelector.LabelStyle>
</sliders:SfDateTimeRangeSelector>

SfDateTimeRangeSelector rangeSelector = new SfDateTimeRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.InactiveFontFamily = "Lobster";

InactiveFontSize

Gets or sets the size for the inactive fonts in the SfSlider, SfRangeSlider, SfRangeSelector,
SfDateTimeSlider, SfDateTimeRangeSlider and SfDateTimeRangeSelector.

Declaration

public double InactiveFontSize { get; set; }

Property Value

Type	Description
System.Double	The default size is `14.0`.

Examples

Snippet for SfSlider

XAML
C#

<sliders:SfSlider Interval = "0.2"
                  ShowLabels = "True">
    <sliders:SfSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontSize = "18" />
    </sliders:SfSlider.LabelStyle>
</sliders:SfSlider>

SfSlider slider = new SfSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.InactiveFontSize = 18;

Snippet for SfDateTimeSlider

XAML
C#

<sliders:SfDateTimeSlider Interval = "0.2"
                          ShowLabels = "True">
    <sliders:SfDateTimeSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontSize = "18" />
    </sliders:SfDateTimeSlider.LabelStyle>
</sliders:SfDateTimeSlider>

SfDateTimeSlider slider = new SfDateTimeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.InactiveFontSize = 18;

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider Interval = "0.2"
                       ShowLabels = "True">
    <sliders:SfRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontSize = "18" />
    </sliders:SfRangeSlider.LabelStyle>
</sliders:SfRangeSlider>

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.InactiveFontSize = 18;

Snippet for SfDateTimeRangeSlider

XAML
C#

<sliders:SfDateTimeRangeSlider Interval = "0.2"
                               ShowLabels = "True">
    <sliders:SfDateTimeRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontSize = "18" />
    </sliders:SfDateTimeRangeSlider.LabelStyle>
</sliders:SfDateTimeRangeSlider>

SfDateTimeRangeSlider rangeSlider = new SfDateTimeRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.InactiveFontSize = 18;

Snippet for SfRangeSelector

XAML
C#

<sliders:SfRangeSelector Interval="0.2"
                         ShowLabels="True">
    <sliders:SfRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontSize="18" />
    </sliders:SfRangeSelector.LabelStyle>
</sliders:SfRangeSelector>

SfRangeSelector rangeSelector = new SfRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.InactiveFontSize = 18;

Snippet for SfDateTimeRangeSelector

XAML
C#

<sliders:SfDateTimeRangeSelector Interval="0.2"
                                 ShowLabels="True">
    <sliders:SfDateTimeRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle InactiveFontSize="18" />
    </sliders:SfDateTimeRangeSelector.LabelStyle>
</sliders:SfDateTimeRangeSelector>

SfDateTimeRangeSelector rangeSelector = new SfDateTimeRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.InactiveFontSize = 18;

InactiveTextColor

Gets or sets the color for the inactive labels in the SfSlider, SfRangeSlider, SfRangeSelector,
SfDateTimeSlider, SfDateTimeRangeSlider and SfDateTimeRangeSelector.

Declaration

public Color InactiveTextColor { get; set; }

Property Value

Type	Description
Microsoft.Maui.Graphics.Color	The default color is `Color.FromRgba(0, 0, 0, 0.87)`.

Examples

Snippet for SfSlider

XAML
C#

<sliders:SfSlider Interval = "0.2"
                  ShowLabels = "True">
    <sliders:SfSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveTextColor = "Red" />
    </sliders:SfSlider.LabelStyle>
</sliders:SfSlider>

SfSlider slider = new SfSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.InactiveTextColor = Colors.Red;

Snippet for SfDateTimeSlider

XAML
C#

<sliders:SfDateTimeSlider Interval = "0.2"
                          ShowLabels = "True">
    <sliders:SfDateTimeSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveTextColor = "Red" />
    </sliders:SfDateTimeSlider.LabelStyle>
</sliders:SfDateTimeSlider>

SfDateTimeSlider slider = new SfDateTimeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.InactiveTextColor = Colors.Red;

Snippet for SfRangeSlider

XAML
C#

< sliders:SfRangeSlider Interval = "0.2"
                       ShowLabels = "True">
    < sliders:SfRangeSlider.LabelStyle>
        < sliders:SliderLabelStyle InactiveTextColor = "Red" />
    </ sliders:SfRangeSlider.LabelStyle>
</ sliders:SfRangeSlider>

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.InactiveTextColor = Colors.Red;

Snippet for SfDateTimeRangeSlider

XAML
C#

<sliders:SfDateTimeRangeSlider Interval = "0.2"
                               ShowLabels = "True">
    <sliders:SfDateTimeRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle InactiveTextColor = "Red" />
    </sliders:SfDateTimeRangeSlider.LabelStyle>
</sliders:SfDateTimeRangeSlider>

SfDateTimeRangeSlider rangeSlider = new SfDateTimeRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.InactiveTextColor = Colors.Red;

Snippet for SfRangeSelector

XAML
C#

<sliders:SfRangeSelector Interval="0.2"
                         ShowLabels="True">
    <sliders:SfRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle InactiveTextColor="Red" />
    </sliders:SfRangeSelector.LabelStyle>
</sliders:SfRangeSelector>

SfRangeSelector rangeSelector = new SfRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.InactiveTextColor = Colors.Red;

Snippet for SfDateTimeRangeSelector

XAML
C#

<sliders:SfDateTimeRangeSelector Interval="0.2"
                         ShowLabels="True">
    <sliders:SfDateTimeRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle InactiveTextColor="Red" />
    </sliders:SfDateTimeRangeSelector.LabelStyle>
</sliders:SfDateTimeRangeSelector>

SfDateTimeRangeSelector rangeSelector = new SfDateTimeRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.InactiveTextColor = Colors.Red;

Offset

Gets or sets the offset for the labels in the SfSlider, SfRangeSlider, SfRangeSelector,
SfDateTimeSlider, SfDateTimeRangeSlider and SfDateTimeRangeSelector. When Orientation is horizontal, the Point.Y will be added with the given offset and then rendered. When Orientation is vertical, the Point.X will be added with the given offset and then rendered. If ShowTicks has been enabled, we have added 5.0 by default else we have added 15.0 by default. We have customized these changes for UI appearance.

Declaration

public double Offset { get; set; }

Property Value

Type	Description
System.Double

Examples

Snippet for SfSlider

XAML
C#

<sliders:SfSlider Interval = "0.2"
                  ShowLabels = "True">
    <sliders:SfSlider.LabelStyle>
        <sliders:SliderLabelStyle Offset = "20" />
    </sliders:SfSlider.LabelStyle>
</sliders:SfSlider>

SfSlider slider = new SfSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.Offset = 20;

Snippet for SfDateTimeSlider

XAML
C#

<sliders:SfDateTimeSlider Interval = "0.2"
                          ShowLabels = "True">
    <sliders:SfDateTimeSlider.LabelStyle>
        <sliders:SliderLabelStyle Offset = "20" />
    </sliders:SfDateTimeSlider.LabelStyle>
</sliders:SfDateTimeSlider>

SfDateTimeSlider slider = new SfDateTimeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
slider.LabelStyle.Offset = 20;

Snippet for SfRangeSlider

XAML
C#

<sliders:SfRangeSlider Interval = "0.2"
                       ShowLabels = "True">
    <sliders:SfRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle Offset = "20" />
    </sliders:SfRangeSlider.LabelStyle>
</sliders:SfRangeSlider>

SfRangeSlider rangeSlider = new SfRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.Offset = 20;

Snippet for SfDateTimeRangeSlider

XAML
C#

<sliders:SfDateTimeRangeSlider Interval = "0.2"
                               ShowLabels = "True">
    <sliders:SfDateTimeRangeSlider.LabelStyle>
        <sliders:SliderLabelStyle Offset = "20" />
    </sliders:SfDateTimeRangeSlider.LabelStyle>
</sliders:SfDateTimeRangeSlider>

SfDateTimeRangeSlider rangeSlider = new SfDateTimeRangeSlider()
{
    ShowLabels = true,
    Interval = 0.2
};
rangeSlider.LabelStyle.Offset = 20;

Snippet for SfRangeSelector

XAML
C#

<sliders:SfRangeSelector Interval="0.2"
                         ShowLabels="True">
    <sliders:SfRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle Offset="20" />
    </sliders:SfRangeSelector.LabelStyle>
</sliders:SfRangeSelector>

SfRangeSelector rangeSelector = new SfRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.Offset  = 20;

Snippet for SfDateTimeRangeSelector

XAML
C#

<sliders:SfDateTimeRangeSelector Interval="0.2"
                                 ShowLabels="True">
    <sliders:SfDateTimeRangeSelector.LabelStyle>
        <sliders:SliderLabelStyle Offset="20" />
    </sliders:SfDateTimeRangeSelector.LabelStyle>
</sliders:SfDateTimeRangeSelector>

SfDateTimeRangeSelector rangeSelector = new SfDateTimeRangeSelector()
{
    ShowLabels = true, 
    Interval = 0.2
};
rangeSelector.LabelStyle.Offset  = 20;