Can we modify the look and feel of the trackbar

4 posts, 0 answers
  1. Barkha
    Barkha avatar
    29 posts
    Member since:
    Oct 2007

    Posted 22 Oct 2007 Link to this post

    Hi All,

    I have a requirement to have a track bar which should be a straight line and the slider should be round in shape.
    Currently the track bar provide scales and the slider is rectangular.
    Is there any way to change the appearance of the trackbar?

    Thanks again in advance for your help.

    -Barkha
  2. Nikolay
    Admin
    Nikolay avatar
    1803 posts

    Posted 25 Oct 2007 Link to this post

    Hello Barkha,

    Thank you for this question.

    Yes, you can modify the look and feel of RadTrackBar. You can achieve the described look by following these steps:

        1. Create an instance of the RadTrackBar by dragging it from the toolbox to your form.
        2. From its Smart Tag menu, open Visual Style Builder.
        3. Give your theme a name in the Theme Name field.
        4. In the Control Structure panel choose RadTrackBarElement, then its properties are shown in the Expert Mode panel.
        5. Set the ShowTicks property  to False.
        6. Then, navigate to TrackBarThumb's BorderPrimitive using the Control Structure panel. The corresponding properties will show in the Expert Mode panel.
        7. Set the Visibility property to either Hidden or Collapsed.
        8. Again, from the Control Structure panel, choose TrackBarThumb's FillPrimitive, then from the Shape property you can choose the desired Thumb form.
        9. From the Visual Style Builder menu choose File, then Save Theme As and save it as a file and then close it.
        10. Add new RadThemeManager to your project, open its Smart Tag and choose Load Theme from file, navigate and choose your new theme file.
        11. From your RadTrackBar property panel, set the Theme Name property to the name of your new theme.

    That is it, now you have your custom RadTrackBar look. We have attached a sample application that illustrates the steps above.

    If we could be of further assistance, do not hesitate to contact us.

    Best wishes,
    Nikolay
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. UI for WinForms is Visual Studio 2017 Ready
  4. Barkha
    Barkha avatar
    29 posts
    Member since:
    Oct 2007

    Posted 25 Oct 2007 Link to this post

    Thanks Nikolay.

    Your inputs were very valuable to me. I have attached the TrackTheme.xml that I am using as a theme to change the trackbar style.
    Only small thing that i am not able to achieve is to darken and thicken the inner line on which the thumb is sliding.
    Can you please help me on that.

    Thanks
    -Barkha
  5. Nikolay
    Admin
    Nikolay avatar
    1803 posts

    Posted 29 Oct 2007 Link to this post

    Hi Barkha,

    We are glad to help you again.

    It is pretty easy to change the look of the RadTrackBar's inner line. Considering the steps mentioned before, while working in Visual Style Builder, you should also follow these:

        1. Choose RadTrackBarElement in the Control Structure panel.
        2. Then, in the Expert Mode panel, navigate to the SliderAreaWidth property. Changing its value will impact the inner line width
        3. Next, to darken the color of this line, or to give it any color you want, just change the SliderAreaGradientColor1 and SliderGradientColor2 properties.

    We have attached a sample theme that shows the final result of all the steps mentioned.

    If you have any further questions, please do not hesitate to write us back.

    Sincerely yours,

    Nikolay
    the Telerik team


    Instantly find answers to your questions at the new Telerik Support Center
Back to Top