Styling the top level to appear as tabs?

5 posts, 2 answers
  1. Chris
    Chris avatar
    19 posts
    Member since:
    Jul 2011

    Posted 03 Nov 2011 Link to this post

    Hi,

        I'd like to take the top level elements of the radmenu and make them appear as tabs and change all their state appearances but I'm having trouble finding that particular template so I can edit the objects. Sorry to ask but can you point me in the right direction? I've looked at the documentation for styling the radmenu but I havent found the particular template, just the random existing resources like brushes I can edit if I break it out? Any insight would be appreciated thanks!
  2. Answer
    Dani
    Admin
    Dani avatar
    848 posts

    Posted 03 Nov 2011 Link to this post

    Hi Chris,

    To accomplish the task of displaying the top level menu items as tabs, you need to modify the TopLevelHeaderTemplate (when the menu item does have submenu items) or the TopLevelItemTemplate (when the menu item does not have submenu items).

    These templates contains a ButtonChrome control which is responsible for the appearance of the RadMenuItems. Therefore this is the main point in your customization process - you should customize the control template of the ButtonChrome control.

    I attach here a basic sample with the TopLevel items as tabs. Please, search for the word NOTe to check modified spots.

    I hope this helps.

    All the best,
    Dani
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  3. DevCraft banner
  4. Chris
    Chris avatar
    19 posts
    Member since:
    Jul 2011

    Posted 04 Nov 2011 Link to this post

    Thanks!

       That helped me through my first challenge, now if I could inquire just a little bit further to supplement the documentation.

    a.     Where might I find the ContentPresenter for the top level menu items to change the font foreground color?

    b.     Also, I'm editing an existing radmenu where somewhere the previous designer has applied colors to the top level menu item apparently somewhere other than in the button chrome. Is there another place I might find settings to elements that could effect the background/border of that top level menu item besides just the button chrome?

        Thanks much for your help!
  5. Chris
    Chris avatar
    19 posts
    Member since:
    Jul 2011

    Posted 04 Nov 2011 Link to this post

    Thanks!

       That helped me through my first challenge, now if I could inquire just a little bit further to supplement the documentation.

    a.     Where might I find the ContentPresenter for the top level menu items to change the font foreground color?

    b.     Also, I'm editing an existing radmenu where somewhere the previous designer has applied colors to the top level menu item apparently somewhere other than in the button chrome. Is there another place I might find settings to elements that could effect the background/border of that top level menu item besides just the button chrome?

        Thanks much for your help!
  6. Answer
    Dani
    Admin
    Dani avatar
    848 posts

    Posted 07 Nov 2011 Link to this post

    Hi Chris,

    The foreground for the top level menu items can be easily changed through a simple style for RadMenuItem. You already have a RadMenuItemStyle in the previously sent sample. If you simply add a Setter to change the foreground, the change will be applied to the top level header menu items.

    Alternatively, the foreground can be changed from the ControlTemplate for TopLevelHeaderItem. Inside the template, you will find:
    <ContentPresenter x:Name="Content" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" Grid.Column="1" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

    If you change that ContentPresenter to a ContentControl, you will be able to apply a different foreground. Of course, this second approach is redundant, because there is no need to change the control template if you can apply a Foreground to the RadMenuItemStyle in the conventional way.

    I hope this helps.

    Regards,
    Dani
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
Back to Top
DevCraft banner