Change color when menu item is highlighted

3 posts, 1 answers
  1. Vadimir
    Vadimir avatar
    24 posts
    Member since:
    Aug 2013

    Posted 02 Mar 2015 Link to this post

    My Telerik control version is 2014.3.1202.40 and I'm using the Expression Dark theme.
    I'd like to modify the color of menu item and it background when the menu item is highlighted (i.e. when the mouse is over). For example, in the attached screen dump, I'd like to set "Copy" to red, and its background to green. I try to find the colors in Telerik.Windows.Controls.Navigation.xaml, but don't know which item to change. Could you help me with that? Thanks.

  2. Answer
    Masha avatar
    355 posts

    Posted 03 Mar 2015 Link to this post

    Hello Gong,

    You need to modify the ControlTemplate of RadMenuItemStyle in order to modify the default highlight style of menu items. To change the foreground color of RadMenuItems you need to updated the VisualState named "Highlighted". Please check the code snippet below:

    <VisualState x:Name="Highlighted">
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="(TextBlock.Foreground)">
                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{StaticResource MenuForeground_MouseOver}"/>

    To change the Background color of highlighted items look for Rectangle named HighlightVisual and update its Fill value.

    I've attached a sample project which demonstrates the above approach.

    I hope it helps.


    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

  3. Vadimir
    Vadimir avatar
    24 posts
    Member since:
    Aug 2013

    Posted 03 Mar 2015 in reply to Masha Link to this post

    Thanks, Masha. It works.
Back to Top