Siticone V4RangeSlider

The SiticoneV4RangeSlider is a powerful, vertically oriented multi-thumb slider designed for advanced range selection scenarios. Unlike standard sliders, it supports up to 4 independent thumbs, allowing users to define multiple ranges (e.g., minimum, low-target, high-target, maximum) within a single control. It features smooth animations, extensive theming, and robust input support.

Values & Ranges

Control the positions of the four independent thumbs and the overall range of the slider.

Property	Type	Description & Usage Example
`Minimum`	int	slider.Minimum = 0; The lowest possible value for the slider track.
`Maximum`	int	slider.Maximum = 100; The highest possible value for the slider track.
`Value`	int	slider.Value = 20; The position of the 1st (bottom-most) thumb.
`Value2`	int	slider.Value2 = 40; The position of the 2nd thumb. Constrained between Value1 and Value3.
`Value3`	int	slider.Value3 = 60; The position of the 3rd thumb. Constrained between Value2 and Value4.
`Value4`	int	slider.Value4 = 80; The position of the 4th (top-most) thumb.

Appearance & Styling

Customize the visual elements including track colors, fill gradients, and thumb styles.

Property	Type	Description & Usage Example
`TrackColor`	Color	slider.TrackColor = Color.LightGray; The background color of the unfilled slider track.
`FillColor`	Color	slider.FillColor = Color.DodgerBlue; The fill color between Thumb 1 and Thumb 2.
`FillColor2`	Color	slider.FillColor2 = Color.Orange; The fill color between Thumb 3 and Thumb 4.
`ThumbColor`	Color	slider.ThumbColor = Color.White; The default color of the slider handles (thumbs).
`ThumbHoverColor`	Color	slider.ThumbHoverColor = Color.Cyan; The color of a thumb when the mouse hovers over it.
`ThumbAnimation`	ThumbAnimation	slider.ThumbAnimation = ThumbAnimation.Blink; Enables visual effects for thumbs: `Normal`, `Blink` (pulsing opacity), or `ColorTransition` (cycles colors).

Interaction & Behavior

Configure how users interact with the slider via mouse and keyboard.

Property	Type	Description & Usage Example
`IsReadOnly`	bool	slider.IsReadOnly = true; If true, prevents the user from changing values. Visuals update to a "disabled" state.
`SmallChange`	int	slider.SmallChange = 1; The increment when using arrow keys.
`LargeChange`	int	slider.LargeChange = 10; The increment when using PageUp/PageDown keys.
`MouseWheelEnabled`	bool	slider.MouseWheelEnabled = true; Allows changing the hovered thumb value using the mouse wheel.
`CanShake`	bool	slider.CanShake = true; If true, the slider shakes visually when a user tries to interact with it in ReadOnly mode.

Designer & Smart Tags

The control includes a rich Smart Tag panel for rapid configuration.

Feature	Description
`Theme Presets`	Instantly apply color schemes like "Ocean Teal", "Sunset Gold", "Purple Orchid", "Crimson Fire", and more via the designer menu.
`Quick Actions`	Shortcuts to set common ranges (0-100, Bipolar -100 to 100) or reset defaults.
`Copy/Paste Settings`	Copy the entire visual configuration of one slider and paste it onto another to ensure UI consistency.

Detailed Usage Examples

Example 1: Temperature Range Control

Using the slider to set a "Comfort Zone" (Value2 to Value3) and an "Absolute Limit" (Value1 to Value4).

C# - Temperature Control

private void InitializeThermostat()
{
    var slider = new SiticoneV4RangeSlider();
    slider.Minimum = 0;   // 0°C
    slider.Maximum = 100; // 100°C
    
                // Set initial ranges
    slider.Value = 10;    // Min safe temp
    slider.Value2 = 22;   // Target Low
    slider.Value3 = 26;   // Target High
    slider.Value4 = 90;   // Max safe temp
    
                // Visuals
    slider.FillColor = Color.LightBlue; // Cold range visual
    slider.FillColor2 = Color.OrangeRed; // Hot range visual
    
    slider.RangeValueChanged += (s, e) => 
    {
                Console.WriteLine($"Comfort Zone: {e.NewValue2}°C - {e.NewValue3}°C");
    };
    
    this.Controls.Add(slider);
}

Example 2: Data Filtering (Histogram)

A vertical slider used to filter data points, showing an active range selection.

C# - Data Filter

private void SetupFilterSlider()
{
    var filterSlider = new SiticoneV4RangeSlider();
    filterSlider.Height = 300;
    
                // Use only middle range (FillColor2 area) for selection
                // Hide outer ranges by matching track color
    filterSlider.TrackColor = Color.WhiteSmoke;
    filterSlider.FillColor = Color.WhiteSmoke; 
    filterSlider.FillColor2 = Color.DodgerBlue; // Active selection range
    
                // Enable tooltips on hover
    filterSlider.RangeValueChanged += (s, e) =>
    {
                FilterDataGrid(e.NewValue3, e.NewValue4); // Filter between V3 and V4
    };
    
    this.Controls.Add(filterSlider);
}

Example 3: Read-Only Status Indicator

Using the slider as a gauge to display system status (e.g., CPU/Memory load) without allowing user edits.

C# - Status Gauge

private void UpdateSystemStatus(int cpuLoad, int memLoad)
{
    statusSlider.IsReadOnly = true;
    statusSlider.CanShake = true; // Feedback if user clicks
    
                // Update values programmatically
    statusSlider.Value2 = cpuLoad;
    statusSlider.Value3 = memLoad;
    
                // Change colors dynamically based on load
    if (cpuLoad > 80) statusSlider.FillColor = Color.Red;
    else statusSlider.FillColor = Color.Green;
}