Sub Menue width

[Abdulhameed]

I would like to have a fixed width for the sub menu.
I tried to use style\template but I couldn't.

Please advise.

[Dani]

Hi Abdulhameed,

You need to modify the TopLevelHeaderTemplate. You can obtain that by generating the ItemContainerStyle in Expression Blend. In the TopLevelHeaderTemplate, change the width of the Grid that is contained in the PopUp element:

<telerik:Popup x:Name="PART_Popup" HorizontalOffset="-1" VerticalOffset="-1">
                <!-- NOTE: change Width of PopUp-->
                <Grid  Width="100">
                    <Grid x:Name="PopupContentElement" Margin="0 0 3 3">
                        <Telerik_Windows_Controls_Chromes:ShadowChrome telerik:StyleManager.Theme="{StaticResource Theme}"/>
                        <Border BorderBrush="{StaticResource MenuPopupOuterBorder}" BorderThickness="1" Background="{StaticResource MenuPopupBackground}">
                            <Grid>
                                <Grid HorizontalAlignment="Left" Width="{Binding Menu.IconColumnWidth, RelativeSource={RelativeSource TemplatedParent}}">
                                    <Rectangle Fill="{StaticResource MenuPopupIconsBackground}" Margin="0 0 2 0"/>
                                    <Grid HorizontalAlignment="Right" Margin="{StaticResource MenuPopupIconsSeparatorMargin}">
                                        <Rectangle Fill="{StaticResource MenuPopupIconsSeparatorLeft}" HorizontalAlignment="Right" Margin="0 0 1 0" Width="1"/>
                                        <Rectangle Fill="{StaticResource MenuPopupIconsSeparatorRight}" HorizontalAlignment="Right" Margin="0 0 0 0" Width="1"/>
                                    </Grid>
                                </Grid>
                                <ItemsPresenter Margin="1"/>
                            </Grid>
                        </Border>
                    </Grid>
                </Grid>
            </telerik:Popup>

If you need to apply the same change for the deeper level of RadMenuItems, you also need to modify the SubMenuHeaderTemplate in the same way.

I hope this helps.

Greetings,
Dani
the Telerik team

[Abdulhameed]

I tried it but it didn't work,
Acutaly for the top level header it worked when I set the ContentGrid width. but for the sub menu it did not work at all.

Please advise?

[Dani]

Hi Abdulhameed,

Attached is a working sample project demonstrating the suggested approach. Search for "NOTE" to check the modified spots. Also, notice how the ItemContainerStyle attached property is applied.

I hope this helps.

All the best,
Dani
the Telerik team

[Abdulhameed]

Many Thanks.