Setting Tick Placement property of rad slider control to Both value, is there any way to provide multiple tick collection to be assigned for each side. For example, I want the TOP tick placement to to take the values from 10 to 0, while the Bottom tick placement should take the values from 0 to 10.
If this is not possible or it is too complicated to achieve this goal with RadSlider control, then, what is the most appropriate control to achieve this?
Thanks in advanced.
If this is not possible or it is too complicated to achieve this goal with RadSlider control, then, what is the most appropriate control to achieve this?
Thanks in advanced.
3 Answers, 1 is accepted
0
Hello Adnan,
Thank you for your interest in RadSlider control.
By default, the Ticks collection of the RadSlider is the same for the top and bottom labels of the slider. Setting different values of the top and bottom labels is not supported by the control out of the box. In your case you want the top to be displayed from 0 to 10, in this case, the slider is expecting the minimum to be less than the maximum. Basically, you can use a custom class IValueConverter class to reverse the bottom labels depending on the top.
For your convenience, we have created sample project which demonstrates an approach to reverse the bottom labels. Give this project a try and let us know if it works for you.
Regards,
Dinko
Telerik by Progress
Thank you for your interest in RadSlider control.
By default, the Ticks collection of the RadSlider is the same for the top and bottom labels of the slider. Setting different values of the top and bottom labels is not supported by the control out of the box. In your case you want the top to be displayed from 0 to 10, in this case, the slider is expecting the minimum to be less than the maximum. Basically, you can use a custom class IValueConverter class to reverse the bottom labels depending on the top.
For your convenience, we have created sample project which demonstrates an approach to reverse the bottom labels. Give this project a try and let us know if it works for you.
Regards,
Dinko
Telerik by Progress
Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
0
Adnan
Top achievements
Rank 1
Rank 1
answered on 30 Mar 2017, 07:56 AM
Hi Dinko,
Thanks for the provided project, I guess this approach will solve the UI problem, but it does not provide a way to differentiate and access the selected top and bottom values since you have only one tick collection to read the selected value from. It would be great to provide this functionality also.
Regards,
Thanks for the provided project, I guess this approach will solve the UI problem, but it does not provide a way to differentiate and access the selected top and bottom values since you have only one tick collection to read the selected value from. It would be great to provide this functionality also.
Regards,
0
Hello Adnan,
In addition to my first reply.
You can try setting the IsDirectionReversed property of the RadSlider to True. You can take a look at the Direction help article in our documentation where this property is described. This way you can reverse the top tick placement values from 10 to 0 and use IValueConverter to set the bottom tick placement values from 0 to 10. For your convenience, I have modified the project from my last reply to demonstrate this approach give it a try and let me know if it works for you.
As for your second question.
You can try creating a reverse collection of the slider double collection. Then you can subscribe to the ValueChanged event of the RadSlider. In the event handler, you can get the index of the selected value in the slider collection and use the same index to get the value of the second collection which represent the bottom values. The attached project demonstrates this approach.
Regards,
Dinko
Telerik by Progress
In addition to my first reply.
You can try setting the IsDirectionReversed property of the RadSlider to True. You can take a look at the Direction help article in our documentation where this property is described. This way you can reverse the top tick placement values from 10 to 0 and use IValueConverter to set the bottom tick placement values from 0 to 10. For your convenience, I have modified the project from my last reply to demonstrate this approach give it a try and let me know if it works for you.
As for your second question.
You can try creating a reverse collection of the slider double collection. Then you can subscribe to the ValueChanged event of the RadSlider. In the event handler, you can get the index of the selected value in the slider collection and use the same index to get the value of the second collection which represent the bottom values. The attached project demonstrates this approach.
Regards,
Dinko
Telerik by Progress
Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which you to write beautiful native mobile apps using a single shared C# codebase.