This example shows how to enable snap to tick behavior in UXRangeSliderBar.

Example

Description

You can enable snap to tick behavior in UXRangeSliderBar using IsSnapToTickEnabled property. When this property is enabled, all user interaction to change the value of SelectionStart and SelectionEnd properties will be adjusted to the closest tickbar item. When you select a position within a tickbar range, it will be adjusted to the closest tickbar item. For example, when you select 3.2 as the selection start of a UXRangeSliderBar that starts from 0 to 10 with LargeChange set to 1, the selection start will be adjusted to the closest tickbar item, which is 3.

The following code example shows how to enable snap to tick behavior in UXRangeSliderBar. It also shows that this behavior will be ignored when the value of SelectionStart and SelectionEnd properties are set programmatically.

Code

private void Button_Click(object sender, RoutedEventArgs e)
{
    uxRangeSlider1.SelectionStart = 2.3;
    uxRangeSlider1.SelectionEnd = 7.8;
}
            

<StackPanel>
    <Button Height="25" Width="200" Content="Change UXRangeSliderBar value" Click="Button_Click"/>
    <Intersoft:UXRangeSliderBar x:Name="uxRangeSlider1" TickPlacement="BottomRight" HandlesVisibility="Visible" 
                                SelectionStart="4" SelectionEnd="8" IsSnapToTickEnabled="True"/>
</StackPanel>
            

When you move the UXThumb along UXRangeSliderBar track or invoke UXRangeSliderBar commands by pressing the handle or increase and decrease buttons, the UXThumb will be moved to the closest tickbar item.

When you click the Button1 control, the selection range of values will start from 2.3 and ends at 7.8. In this case, the selection range will not be adjusted to the closest tickbar item because it is not invoked by user interaction.