RadRangeSlider SelectionChanged Event

[Josh]

I noticed that there is no RadRangeSlider.SelectionChanged event. Is there another event (or multiple events) that would be raised when either the SelectionStart or the SelectionEnd have changed?

I know I could use something like:

RegisterPropertyChangedCallback(KioskRangeSlider.SelectionStartProperty, OnSelectionChanged)

But that introduces some problems of its own and I'd prefer an event on the RadRangeSlider.

I'm using 2016.2.711.45 and I now realize that there is a newer version, but I don't see any documentation about whether 2016.3 adds this functionality.

Thanks.

[Josh]

Well look at that! v2016.3.914.45 does in fact add a RadRangeSlider.SelectionChanged.

Thanks for the pre-emptive addition, Telerik! :)

[Josh]

Perhaps I celebrated too soon. While there is a new SelectionChanged event on the RadRangeSlider, it does not seem to be raised under any of the scenarios I tried: Change Start, Change End, Drag Range.

Is there something special needed for this event to be raised or is it a bug?

[Vladislav]

Hi Josh,

Thank you for contacting us.
Can you please assure that you are using RadRangeSlider for UWP control, from the UI for Universal Windows Platform suite? Since this control doesn't have such event (SelectionChanged)? 

Regards,
Vladislav
Telerik by Progress

[Josh]

Hi Vladislav,

You are right, I started with a clean project and realized that the SelectionChanged event was due to some other testing and code I had added. 

So back to the original question, is there a recommended approach for an event on the change of the Start or End value? For now, I'd prefer to use something native to the RangeSlider control, but perhaps I'll need to use an attached property on SelectionStart and SelectionEnd to raise a custom event.

[Josh]

I ended up implementing my own SelectionChanged event.

In case anyone is interested...

First, derive a control from RadRangeSlider and include two new Dependency Properties (I used CustomStartValue, CustomEndValue). These will be bound on the control to raise DependencyPropertyChanged events.

When the DependencyProperty changes, we can then raise a SelectionChanged event on the CustomRangeSlider.

public class CustomRangeSlider : RadRangeSlider
{
    public event EventHandler SelectionChanged;

    #region Custom Start/End Properties for Change event binding

    public static readonly DependencyProperty CustomStartValueProperty =
        DependencyProperty.Register(nameof(CustomStartValue),
                typeof(double),
                typeof(CustomRangeSlider),
                new PropertyMetadata(0.0d, ValueChanged));

    /// <summary>
    /// Bindable property to listen for SelectionChanged events
    /// </summary>
    public double CustomStartValue
    {
        get { return (double)GetValue(CustomStartValueProperty); }
        set { SetValue(CustomStartValueProperty, value); }
    }

    public static readonly DependencyProperty CustomEndValueProperty =
        DependencyProperty.Register(nameof(CustomEndValue),
                typeof(double),
                typeof(CustomRangeSlider),
                new PropertyMetadata(0.0d, ValueChanged));

    /// <summary>
    /// Bindable property to listen for SelectionChanged events
    /// </summary>
    public double CustomEndValue
    {
        get { return (double)GetValue(CustomEndValueProperty); }
        set { SetValue(CustomEndValueProperty, value); }
    }

    #endregion

    public CustomRangeSlider()
    {
    }

    private static void ValueChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        var slider = d as CustomRangeSlider;
        slider.OnSelectionChanged();
    }

    public void OnSelectionChanged()
    {
        SelectionChanged?.Invoke(this, EventArgs.Empty);
    }
}

The above is just a simple implementation. You can further extend this by using SelectionChangedEventArgs and pass through the old/new values.

Then, in XAML, use the new CustomRangeSlider control and bind  the Dependency Properties to the SelectionStart and SelectionEnd properties on the control. 

<controls:CustomRangeSlider x:Name="myRangeSlider"
           SelectionStart="{x:Bind ViewModel.SliderMin, Mode=TwoWay}"
           SelectionEnd="{x:Bind ViewModel.SliderMax, Mode=TwoWay}"
           CustomStartValue="{x:Bind myRangeSlider.SelectionStart, Mode=OneWay}"
           CustomEndValue="{x:Bind myRangeSlider.SelectionEnd, Mode=OneWay}">
</controls:CustomRangeSlider>

You can still bind SelectionStart and SelectionEnd to ViewModel property, but these new Dependency Properties will listen for changes to either and raise the SelectionChanged event.

Hope this helps.

Josh

[Lance | Manager Technical Support]

Hello Josh,

We do have "RangeSelectionChanged" event handlers feature request on the backlog for the RadRangeSlider. However, we cannot promise a specific time frame for it's implementation. If you'd like to publicly add it to our feature request site and vote it up, you can do so here.

What you have posted below is a good approach for those whom are not using MVVM and want an event fired when the value changes, thank you for sharing. 

Regards,
Lance | Tech Support Engineer, Sr.
Telerik by Progress