Change Style of Tab Item

3 posts, 1 answers
  1. Thomas
    Thomas avatar
    12 posts
    Member since:
    Mar 2010

    Posted 18 Jun 2018 Link to this post


    we're currently using VS2015 and the latest Telerik WPF controls (no XAML). Our project is made with MVVM in mind.
    What is the right way of changing the "Tab Item" style? We tried to change the style but this doesn't seem to work as the changes are not applied. Then we tried to create a new DataTemplate which also doesn't work the way we expected it.

    Our RadTabControl is set to show the tabs on the left side and we're using the Office2016 template at the moment.

    We just want to change three things:

    1. Set the text align to left
    2. Add more "inner space" (padding) around the text
    3. Change the background color of the "Tab Item" (header) to a specific color and also change the hover and selected color of the tab.

    How can we change that? Is it only possible to locate the information in the template XAML files an copy all the stuff over and change it or is there a simpler method for this?

    Thank you in advance for your help.

    Best Regards,
  2. Answer
    Vicky avatar
    49 posts

    Posted 18 Jun 2018 Link to this post

    Hi Thomas,

    in order to achieve the desired changes, you need to override RadTabItem's style. You must also change item's ControlTemplate a bit in order to customize the hover and selected states of each item.

    As you are using Implicit Styles, after you have successfully applied the theme (in your case Office2016) and merged the required by RadTabControl dictionaries, you must create a new style, based on the RadTabItemStyle, and override its Template property (needed for hover and selected states), as well as the properties that you mentioned, i.e. HorizontalContentAlignment (responsible for each tab's text alignment), Padding (responsible for the space around tab's text) and Background.

    Please, check the attached sample that demonstrates the described above approach, and let me know if it helps.

    Viktoria Grozdancheva
    Progress Telerik
    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. Thomas
    Thomas avatar
    12 posts
    Member since:
    Mar 2010

    Posted 21 Jun 2018 in reply to Vicky Link to this post

    Works perfectly! Thank you Viktoria. Best Regards, Thomas
Back to Top