It uses RadMenuItems with their Popups removed so rows and columns may be formed and unclickable headers may appear.
There is small problem in your styles - the default content property of the RadMenuItems is its submenu items. So setting a Grid inside the RadMenuItem the framework will automatically see that it is not a RadMenuItem and wrap it in one. I guess that's why you have set implicit style for the highlight thinking that the only way to remove it is set implicit styles but the actual problem is one menu item that is not visible in the XAMl is generated for you. I think the solution would be to simply put the grid in the Header of the RadMenuItem like this:
<
UserControl
x:Class
=
"RadmenuExample.MainPage"
xmlns:vsm
=
"clr-namespace:System.Windows;assembly=System.Windows"
xmlns:teleriknavigation
=
"clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation"
xmlns:animation
=
"clr-namespace:Telerik.Windows.Controls.Animation;assembly=Telerik.Windows.Controls"
mc:Ignorable
=
"d"
>
<
UserControl.Resources
>
<
Thickness
x:Key
=
"MenuSubItemMargin"
>2</
Thickness
>
<
CornerRadius
x:Key
=
"SplitButton_SpanCornerRadius"
>1</
CornerRadius
>
<
CornerRadius
x:Key
=
"SplitButton_SpanInnerCornerRadius"
>0</
CornerRadius
>
<
SolidColorBrush
x:Key
=
"ControlInnerBorder_Highlighted"
Color
=
"#FFFFFFFF"
/>
<
SolidColorBrush
x:Key
=
"ControlOuterBorder_Highlighted"
Color
=
"#FFFFC92B"
/>
<
LinearGradientBrush
x:Key
=
"ControlBackground_Highlighted"
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#FFFFFBDA"
Offset
=
"0"
/>
<
GradientStop
Color
=
"#FFFFFBA3"
Offset
=
"1"
/>
</
LinearGradientBrush
>
<!-- This Sub Menu Item template will not display a highlight when the cursor is over it. -->
<
ControlTemplate
x:Key
=
"SubMenuItemNoHighlightTemplate"
TargetType
=
"teleriknavigation:RadMenuItem"
>
<
Grid
x:Name
=
"RootElement"
>
<
vsm:VisualStateManager.VisualStateGroups
>
<
vsm:VisualStateGroup
x:Name
=
"CommonStates"
>
<
vsm:VisualState
x:Name
=
"Highlighted"
>
<!-- The highlighting is disabled here. -->
<!--<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"HighlightVisual"
Storyboard.TargetProperty
=
"Visibility"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0:0:0"
Value
=
"Visible"
/>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>-->
</
vsm:VisualState
>
<
vsm:VisualState
x:Name
=
"Disabled"
>
<
Storyboard
>
<
DoubleAnimationUsingKeyFrames
Storyboard.TargetName
=
"ContentGrid"
Storyboard.TargetProperty
=
"Opacity"
>
<
DiscreteDoubleKeyFrame
KeyTime
=
"0"
Value
=
"0.5"
/>
</
DoubleAnimationUsingKeyFrames
>
</
Storyboard
>
</
vsm:VisualState
>
<
vsm:VisualState
x:Name
=
"Normal"
/>
</
vsm:VisualStateGroup
>
<
vsm:VisualStateGroup
x:Name
=
"FocusStates"
>
<
vsm:VisualState
x:Name
=
"Unfocused"
/>
<
vsm:VisualState
x:Name
=
"Focused"
/>
</
vsm:VisualStateGroup
>
<
vsm:VisualStateGroup
x:Name
=
"CheckStates"
>
<
vsm:VisualState
x:Name
=
"Checked"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"Tick"
Storyboard.TargetProperty
=
"Visibility"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Visible"
/>
</
ObjectAnimationUsingKeyFrames
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"Icon"
Storyboard.TargetProperty
=
"Visibility"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Collapsed"
/>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
vsm:VisualState
>
<
vsm:VisualState
x:Name
=
"Unchecked"
/>
<
vsm:VisualState
x:Name
=
"HideIcon"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"Icon"
Storyboard.TargetProperty
=
"Visibility"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Visible"
/>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
vsm:VisualState
>
</
vsm:VisualStateGroup
>
</
vsm:VisualStateManager.VisualStateGroups
>
<
Border
Background
=
"{TemplateBinding Background}"
BorderBrush
=
"{TemplateBinding BorderBrush}"
BorderThickness
=
"{TemplateBinding BorderThickness}"
/>
<
Grid
Margin
=
"{StaticResource MenuSubItemMargin}"
>
<!-- This can be removed if the highlighting is disabled, but it is left for the purpose of the example. -->
<
Border
x:Name
=
"HighlightVisual"
Visibility
=
"Collapsed"
CornerRadius
=
"{StaticResource SplitButton_SpanCornerRadius}"
BorderThickness
=
"1"
BorderBrush
=
"{StaticResource ControlOuterBorder_Highlighted}"
Background
=
"{StaticResource ControlBackground_Highlighted}"
>
<
Border
BorderThickness
=
"1"
CornerRadius
=
"{StaticResource SplitButton_SpanInnerCornerRadius}"
BorderBrush
=
"{StaticResource ControlInnerBorder_Highlighted}"
/>
</
Border
>
<
Grid
x:Name
=
"ContentGrid"
>
<
Grid.ColumnDefinitions
>
<
ColumnDefinition
Width
=
"Auto"
/>
<
ColumnDefinition
Width
=
"*"
/>
</
Grid.ColumnDefinitions
>
<
Grid
Width
=
"{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Menu.IconColumnWidth}"
>
<
Path
x:Name
=
"Tick"
Grid.Column
=
"0"
Visibility
=
"Collapsed"
VerticalAlignment
=
"Center"
HorizontalAlignment
=
"Center"
Fill
=
"{TemplateBinding Foreground}"
Data
=
"M 0,5.1 L 1.7,5.2 L 3.4,7.1 L 8,0.4 L 9.2,0 L 3.3,10.8 Z"
/>
<
ContentPresenter
x:Name
=
"Icon"
Grid.Column
=
"0"
Margin
=
"2 2 10 2"
Content
=
"{TemplateBinding Icon}"
ContentTemplate
=
"{TemplateBinding IconTemplate}"
/>
</
Grid
>
<
ContentPresenter
x:Name
=
"Content"
Grid.Column
=
"1"
Margin
=
"{TemplateBinding Padding}"
HorizontalAlignment
=
"{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment
=
"{TemplateBinding VerticalContentAlignment}"
Content
=
"{TemplateBinding Header}"
ContentTemplate
=
"{TemplateBinding HeaderTemplate}"
>
</
ContentPresenter
>
</
Grid
>
</
Grid
>
</
Grid
>
</
ControlTemplate
>
<!-- The 'No Highlight' template is applied to all RadMenuItems implicitly. -->
<
Style
x:Name
=
"RadMenuItemStyle"
TargetType
=
"teleriknavigation:RadMenuItem"
>
<
Setter
Property
=
"SubmenuItemTemplateKey"
Value
=
"{StaticResource SubMenuItemNoHighlightTemplate}"
/>
<
Setter
Property
=
"Template"
Value
=
"{StaticResource SubMenuItemNoHighlightTemplate}"
/>
</
Style
>
</
UserControl.Resources
>
<
Grid
x:Name
=
"LayoutRoot"
Background
=
"White"
>
<
teleriknavigation:RadMenu
VerticalAlignment
=
"Top"
>
<
teleriknavigation:RadMenuItem
Header
=
"Item 1"
>
<
teleriknavigation:RadMenuItem
Style
=
"{StaticResource RadMenuItemStyle}"
>
<
teleriknavigation:RadMenuItem.Header
>
<!-- This content is wrapped in a RadMenuItem implicitly, which cannot be styled unless implicitly applying
the style to all RadMenuItems. -->
<
Grid
>
<
Grid.ColumnDefinitions
>
<
ColumnDefinition
Width
=
"Auto"
/>
<
ColumnDefinition
Width
=
"Auto"
/>
</
Grid.ColumnDefinitions
>
<
Grid.RowDefinitions
>
<
RowDefinition
Height
=
"Auto"
/>
<
RowDefinition
Height
=
"Auto"
/>
</
Grid.RowDefinitions
>
<
teleriknavigation:RadMenuItem
Grid.Row
=
"0"
Grid.Column
=
"0"
>
<
teleriknavigation:RadMenuItem
Header
=
"Item 2"
/>
<
teleriknavigation:RadMenuItem
Header
=
"Item 3"
/>
<
teleriknavigation:RadMenuItem
Header
=
"Item 4"
/>
</
teleriknavigation:RadMenuItem
>
<
teleriknavigation:RadMenuItem
Grid.Row
=
"0"
Grid.Column
=
"1"
>
<
teleriknavigation:RadMenuItem
Header
=
"Item 5"
/>
<
teleriknavigation:RadMenuItem
Header
=
"Item 6"
/>
<
teleriknavigation:RadMenuItem
Header
=
"Item 7"
/>
</
teleriknavigation:RadMenuItem
>
<
teleriknavigation:RadMenuItem
Grid.Row
=
"1"
Grid.Column
=
"0"
>
<
teleriknavigation:RadMenuItem
Header
=
"Item 8"
/>
<
teleriknavigation:RadMenuItem
Header
=
"Item 9"
/>
<
teleriknavigation:RadMenuItem
Header
=
"Item 10"
/>
</
teleriknavigation:RadMenuItem
>
<
teleriknavigation:RadMenuItem
Grid.Row
=
"1"
Grid.Column
=
"1"
>
<
teleriknavigation:RadMenuItem
Header
=
"Item 11"
/>
<
teleriknavigation:RadMenuItem
Header
=
"Item 12"
/>
<
teleriknavigation:RadMenuItem
Header
=
"Item 13"
/>
</
teleriknavigation:RadMenuItem
>
</
Grid
>
</
teleriknavigation:RadMenuItem.Header
>
</
teleriknavigation:RadMenuItem
>
</
teleriknavigation:RadMenuItem
>
</
teleriknavigation:RadMenu
>
</
Grid
>
</
UserControl
>