Change the black background of main menu item

12 posts, 0 answers
  1. Jonathan
    Jonathan avatar
    5 posts
    Member since:
    Jul 2008

    Posted 03 Aug 2008 Link to this post

    hi all--

    i was wondering if there was a way to change the black background highlight to a different color when you mouseover (and open) a top-level menu item.

    i'm new to templates so if that's the answer, a point in the right direction would be much appreciated!

    thanks!

    jon
  2. Hristo
    Admin
    Hristo avatar
    832 posts

    Posted 04 Aug 2008 Link to this post

    Hi Jonathan,

    Thanks for the interest in using our controls.

    Now, straight to the problem. The only way to change the black highlight background on mouseover is to create a new control template for TopLevelHeader or TopLevelItem items. TopLevelItem is an item with RadMenu as parent and no children. TopLevelHeader is TopLevelItem with children.

    At the moment Blend 2.5 doesn't support direct editing of control templates for custom controls but I believe this will change with the next version. You can find menu templates in the Telerik.Windows.Controls.Navigation assembly as resource - theme/menu.xaml. Editing this file in Blend should not be a problem. From there you can change the black background and then reuse this template in your application.

    If you have any other questions, please, do not hesitate to contact us

    Regards,
    Hristo
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. DevCraft banner
  4. Michael
    Michael avatar
    4 posts
    Member since:
    Oct 2007

    Posted 23 Sep 2008 Link to this post

    Hi!

    How can I actualy see the resource  theme/menu.xaml?

    thx, mikel
  5. Hristo
    Admin
    Hristo avatar
    832 posts

    Posted 23 Sep 2008 Link to this post

    Hello Michael,

    There are 2 way to edit our resources:
    1. From your Client.Net account you can download solution that have all controls ready for work with Blend 2.5
    2. You can use Reflector, load our assemblies and save the Resources.

    I hope this helps.

    Best wishes,
    Hristo
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. Michael
    Michael avatar
    4 posts
    Member since:
    Oct 2007

    Posted 23 Sep 2008 Link to this post

    Thank you I found the info.

    What I want to achieve is to make a gradient fill for the MenuPanels.
    Any Info how to do this?

    thx, Michael
  7. Hristo
    Admin
    Hristo avatar
    832 posts

    Posted 24 Sep 2008 Link to this post

    Hello Michael,

    You can read how to change the menuPanels background here:
    http://www.telerik.com/community/forums/thread/b311D-bgatad.aspx#636582

    Let me know if you have other questions.


    Best wishes,
    Hristo
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  8. david
    david avatar
    18 posts
    Member since:
    Jan 2009

    Posted 24 Jan 2009 Link to this post

    Hi,
    I read the posts, but didnt find any solution how to change he background color of submenu's popup.
    I downloaded from you the blend solution with dlls and default styles but cant manage to edit the menu.xaml in this solution in the way that the submenu's background color will be changed.
    How to apply these submenu/toplevel/header/item templates to menu??

    This doesnt work:

             <telerik:RadMenu Height="30" VerticalAlignment="Top">
                <telerik:RadMenuItem Header="FILE"
                                     SubmenuItemTemplateKey="{StaticResource SubMenuItemTemplate}"
                                     SubmenuHeaderTemplateKey="{StaticResource SubMenuHeaderTemplate}"
                                     TopLevelItemTemplateKey="{StaticResource TopLevelItemTemplate}"
                                     >
                    <telerik:RadMenuItem.Icon>
                        <Image Source="Images/RadClock.png" />
                    </telerik:RadMenuItem.Icon>
                    <telerik:RadMenuItem Header="New" >
                        <telerik:RadMenuItem.Icon>
                            <Image Source="Images/RadClock.png" />
                        </telerik:RadMenuItem.Icon>
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem Header="Open" />
                </telerik:RadMenuItem>
            </telerik:RadMenu>

    In the same file I have the same <UserControl.Resources> as in your file "menu.xaml". I cant figure the mechanism how these templates in the <UserControl.Resources> are applied to above menu...
    Thanks,
    David
  9. Hristo
    Admin
    Hristo avatar
    832 posts

    Posted 27 Jan 2009 Link to this post

    Hi david,

    If you have already all the control templates you can set them by the Style setter like in the Menu.xaml:

        <!-- RadMenuItem --> 
        <Style TargetType="telerikNavigation:RadMenuItem" x:Key="RadMenuItemStyle1">  
            <Setter Property="TopLevelHeaderTemplateKey" Value="{StaticResource TopLevelHeaderTemplate}" /> 
            <Setter Property="TopLevelItemTemplateKey" Value="{StaticResource TopLevelItemTemplate}" /> 
            <Setter Property="SubmenuHeaderTemplateKey" Value="{StaticResource SubMenuHeaderTemplate}" /> 
            <Setter Property="SubmenuItemTemplateKey" Value="{StaticResource SubMenuItemTemplate}" /> 
            <Setter Property="Template" Value="{StaticResource SubMenuItemTemplate}" /> 
            <Setter Property="HorizontalContentAlignment" Value="Left" /> 
            <Setter Property="VerticalContentAlignment" Value="Center" /> 
        </Style> 

    Then you can set the style on all RadMenuItems referencing the RadMenuItem style by key like:

     <telerik:RadMenuItem Header="New" Style={StaticResource RadMenuItemStyle1}>    
     

    In order to change the background of the popup control you should change the backgorund of the most inner border in Popup. In the default (summer) theme the background brush is ContentBackgroundBrush (the background of the most inner border).

    <Popup x:Name="PART_Popup" VerticalOffset="-1" HorizontalOffset="-3">  
                    <Border BorderBrush="{StaticResource RadMenu_PopupShadowBorder2}" 
                            BorderThickness="1,0,1,1">  
                        <Border BorderBrush="{StaticResource RadMenu_PopupShadowBorder1}" 
                                BorderThickness="1,0,1,1">  
                            <Border Background="{StaticResource ContentBackgroundBrush}" 
                                    BorderBrush="{StaticResource BorderOuterBrush}" 
                                    BorderThickness="1">  
                                <Grid> 
                                    <Rectangle Margin="24,0,0,0" Width="1" 
                                            Fill="{StaticResource SeparatorLine1}" 
                                            HorizontalAlignment="Left" /> 
                                    <Rectangle Margin="25,0,0,0" Width="1" 
                                            Fill="{StaticResource SeparatorLine2}" 
                                            HorizontalAlignment="Left" /> 
                                    <ItemsPresenter /> 
                                </Grid> 
                            </Border> 
                        </Border> 
                    </Border> 
                </Popup> 

    Let me know if you need more help.

    Greetings,

    Hristo
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  10. senthil kumar
    senthil kumar avatar
    2 posts
    Member since:
    Nov 2009

    Posted 23 Dec 2009 Link to this post

    Hi

    I m new to silverlight. I like to use radmenu ,but I need to style the radmenu such as
    I need to change color of menu , mouseover color, pressed menuitem color, popup background color.

    How I have to do.
    Please provide the code for styling entire menu and menuitems.

    Thks and Regards
    Senthil


  11. Pana
    Admin
    Pana avatar
    748 posts

    Posted 28 Dec 2009 Link to this post

    Hello Senthil Kumar,

    I have attached an example with custom theme that includes only the RadMenu based on the Office_Silver theme. You can find the xaml in the CustomTheme\Themes\Office\Silver\Menu.xaml. The xaml for all telerik controls can be found in the distribution packages. I have attached the Office_silver theme so you can easily can copy-paste the files with styles for the controls you will use in your project. To add styles for other controls than RadMenu you can create a separate xaml file (for example Generic.xaml) that uses merged dictionaries to add the styles for the Menu and the rest of the controls.

    You can learn in details for the theming here.

    Thanks for your interest in our controls.

    Sincerely yours,
    Panayot
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  12. Pan hal
    Pan hal avatar
    61 posts
    Member since:
    Aug 2009

    Posted 14 Jun 2010 Link to this post

    Hi,
      Your example helped me to solve one of my problem. 
      I ahve one more requirement. The radmenu sub items pops up when ever user mouse over on the main radmenu item.
    How to avoid this. The submenu items should show up only when user press/click the main radmenu item. 

     

    This is urgent requirement.Can you please help me.

     

  13. Hristo
    Admin
    Hristo avatar
    832 posts

    Posted 16 Jun 2010 Link to this post

    Hi Pan hal,

    You could use RadMenu ShowDelay property. Just set it to some large TimeSpan and them sub menu popup will open only on Click.

    Let us know if you need more information.


    Best wishes,
    Hristo
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Back to Top
DevCraft banner