Class ColorRangeDataModel

Represents a data model for defining color ranges in the Slider component.

Inheritance

System.Object

ColorRangeDataModel

Namespace: Syncfusion.Blazor.Inputs

Assembly: Syncfusion.Blazor.dll

Syntax

public class ColorRangeDataModel : Object

Remarks

This class defines a color range segment that can be applied to specific portions of the slider track. Color ranges allow for visual differentiation of different value segments on the slider, enhancing the user experience by providing visual cues about value ranges or categories.

Examples

Creating color ranges for a slider:

<SfSlider @bind-Value="sliderValue" TValue="int" Min="0" Max="100" ColorRange="colorRanges">
</SfSlider>

@code {
    private int sliderValue = 30;
    private List<ColorRangeDataModel> colorRanges = new List<ColorRangeDataModel>
    {
        new ColorRangeDataModel { Start = 0, End = 25, Color = "#ff4081", Id = "low" },
        new ColorRangeDataModel { Start = 25, End = 75, Color = "#4caf50", Id = "medium" },
        new ColorRangeDataModel { Start = 75, End = 100, Color = "#ff9800", Id = "high" }
    };
}

Constructors

ColorRangeDataModel()

Declaration

public ColorRangeDataModel()

Properties

Color

Gets or sets the color to be applied to the slider track for this range.

Declaration

public string Color { get; set; }

Property Value

Type	Description
System.String	A string representing the color value in any valid CSS color format (hex, rgb, rgba, named colors, etc.). The default value is string.Empty.

Remarks

This property defines the color that will be applied to the portion of the slider track between the Start and End values. The color can be specified in various formats such as hexadecimal (#ff0000), RGB (rgb(255, 0, 0)), or named colors (red).

End

Gets or sets the ending value of the color range.

Declaration

public double End { get; set; }

Property Value

Type	Description
System.Double	A double representing the end value of the range where the color should stop being applied.

Remarks

This property defines the upper boundary of the color range. The color specified in Color will be applied to the slider track from the Start value up to this End value. The End value should be greater than the Start value.

Id

Gets or sets the unique identifier for this color range.

Declaration

public string Id { get; set; }

Property Value

Type	Description
System.String	A string representing a unique identifier for the color range. The default value is null.

Remarks

This property provides a unique identifier for the color range, which can be useful for programmatic manipulation, tracking, or referencing specific color ranges. It allows developers to distinguish between different color ranges when multiple ranges are defined for a single slider.

Start

Gets or sets the starting value of the color range.

Declaration

public double Start { get; set; }

Property Value

Type	Description
System.Double	A double representing the start value of the range where the color should begin being applied.

Remarks

This property defines the lower boundary of the color range. The color specified in Color will be applied to the slider track starting from this Start value up to the End value. The Start value should be less than the End value.