How to add major and minor ticks to the slider?

3 posts, 0 answers
  1. Adnan
    Adnan avatar
    15 posts
    Member since:
    Sep 2013

    Posted 04 Apr Link to this post

    I am trying to create the slider design demonstrated in the attachment (with making tick crossing the track of the slider), but I had many difficulties. Is it possible to do this design? what is the simplest way to do it? I hope the answer is explained with a sample project. 
  2. Tanya
    Admin
    Tanya avatar
    575 posts

    Posted 07 Apr Link to this post

    Hello Adnan,

    There are several articles describing how you can change the appearance of RadSlider. You can find them in the Styling and Appearance and How To sections in our documentation.

    Hope this helps.

    Regards,
    Tanya
    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.
  3. Evgenia
    Admin
    Evgenia avatar
    1437 posts

    Posted 07 Apr Link to this post

    Hello Adnan,

    As a follow-up, I am sharing a small project demonstrating how you can modify the default style of RadSlider to have the Ticks appear on top of the Track. Since we don't support Major and Minor ticks (the different size of the ticks) out-of-the-box I highly recommend that you  go through this help topic which demonstrates how you might achieve it via TicksTemplateSelector. Inside the custom logic of the SelectTemplate method you might check if your Tick is even and apply the template with smaller Height. If odd let it take the default Template of the Ticks (with bigger Height).

    Please mind that the project attached uses Office2016 theme that is currently supported only with Implicit styles theming mechanism. So to be able to run the project please add reference to assemblies from Binaries.NoXAML folder under your Telerik controls local installation path. You can read more about implicit styles and our Binaries.NoXAML folder in this help topic.

    Feel free to modify the attachment per your own scenario needs.

    Regards,
    Evgenia
    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.
Back to Top