Range and Thumb Values | ComponentOne Input for WinForms

Range and Thumb Values

In This Topic

Range in C1RangeSlider control is the difference between UpperValue and LowerValue properties. These two values are linked with movable thumbs which are used to set the numeric range on the control.

slider-range"

Setting the Thumb Values

Thumb values can be set using UpperValue and LowerValue properties in properties pane or through code.

By default, the UpperValue property is set to 100, and LowerValue property is set to 0.

Visual Basic	Copy Code
Me.c1RangeSlider1.LowerValue = 24 Me.c1RangeSlider1.UpperValue = 88

Visual Basic

Copy Code

Me.c1RangeSlider1.LowerValue = 24

Me.c1RangeSlider1.UpperValue = 88

C#	Copy Code
this.c1RangeSlider1.LowerValue = 24; this.c1RangeSlider1.UpperValue = 88;

Copy Code

this.c1RangeSlider1.LowerValue = 24;

this.c1RangeSlider1.UpperValue = 88;

Additionally, the thumb values have its associated value changed events. When the lower thumb value changes, it triggers the LowerValueChanged event and when upper thumb value is changed, the UpperValueChanged event is triggered. These value change events can be used to trigger actions on other controls. For example, the LowerValueChanged and UpperValueChanged events can filter data in C1FlexGrid as illustrated in the GIF below:

Range slider filter gif

The below code demonstrates use of LowerValueChanged and UpperValueChanged events to filter data in C1FlexGrid control. Here, the filter is applied on the Cost column of the grid.

C#	Copy Code
private void c1RangeSlider1_LowerValueChanged(object sender, EventArgs e) { var filter1 = new ConditionFilter(); filter1.Condition1.Operator = ConditionOperator.GreaterThanOrEqualTo; filter1.Condition1.Parameter = c1RangeSlider1.LowerValue; filter1.Condition2.Operator = ConditionOperator.LessThanOrEqualTo; filter1.Condition2.Parameter = c1RangeSlider1.UpperValue; c1FlexGrid1.Cols["Cost"].Filter = filter1; c1Label1.Text = "$" + Convert.ToInt64(c1RangeSlider1.LowerValue); } private void c1RangeSlider1_UpperValueChanged(object sender, EventArgs e) { var filter2 = new ConditionFilter(); filter2.Condition1.Operator = ConditionOperator.LessThanOrEqualTo; filter2.Condition1.Parameter = c1RangeSlider1.UpperValue; filter2.Condition2.Operator = ConditionOperator.GreaterThanOrEqualTo; filter2.Condition2.Parameter = c1RangeSlider1.LowerValue; c1FlexGrid1.Cols["Cost"].Filter = filter2; c1Label2.Text = "$" + Convert.ToInt64(c1RangeSlider1.UpperValue); }

Copy Code

private void c1RangeSlider1_LowerValueChanged(object sender, EventArgs e)
{
    var filter1 = new ConditionFilter();
    filter1.Condition1.Operator = ConditionOperator.GreaterThanOrEqualTo;
    filter1.Condition1.Parameter = c1RangeSlider1.LowerValue;
    filter1.Condition2.Operator = ConditionOperator.LessThanOrEqualTo;
    filter1.Condition2.Parameter = c1RangeSlider1.UpperValue;
    c1FlexGrid1.Cols["Cost"].Filter = filter1;
    c1Label1.Text = "$" + Convert.ToInt64(c1RangeSlider1.LowerValue);
}

private void c1RangeSlider1_UpperValueChanged(object sender, EventArgs e)
{
    var filter2 = new ConditionFilter();
    filter2.Condition1.Operator = ConditionOperator.LessThanOrEqualTo;
    filter2.Condition1.Parameter = c1RangeSlider1.UpperValue;
    filter2.Condition2.Operator = ConditionOperator.GreaterThanOrEqualTo;
    filter2.Condition2.Parameter = c1RangeSlider1.LowerValue;
    c1FlexGrid1.Cols["Cost"].Filter = filter2;
    c1Label2.Text = "$" + Convert.ToInt64(c1RangeSlider1.UpperValue);
}