multi-columns for sub-menus.

[troy]

I'm having trouble figuring out how to make the sub-menu's wrap.  Using the code from the demo, it works fine for the top-level menus, but it ignores the style for the sub menus.  Any help would be appreciated!

Troy

    <UserControl.Resources>
        <Style x:Key="ItemStyle" TargetType="tkn:RadMenuItem">
            <Setter Property="ItemsPanel">
                <Setter.Value>
                    <ItemsPanelTemplate>
                        <!-- set different MaxHeight to control the size of the menu -->
                        <tk:RadWrapPanel Orientation="Vertical" MaxHeight="300" />
                    </ItemsPanelTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>
    
  <Grid x:Name="LayoutRoot">
        <tkn:RadMenu x:Name="radMenu" VerticalAlignment="Top" HorizontalAlignment="Left" Width="50" Orientation="Vertical" ClickToOpen="False">
            <tkn:RadMenuItem Header="Menu 1" Width="50">
                <tkn:RadMenuItem Header="SubMenu 1"/>
                <tkn:RadMenuItem Header="SubMenu 2"/>
                <tkn:RadMenuItem Header="SubMenu 3"/>
                <tkn:RadMenuItem Header="SubMenu 4"/>
                <tkn:RadMenuItem Header="SubMenu 5"/>
                <tkn:RadMenuItem Header="SubMenu 6"/>
                <tkn:RadMenuItem Header="SubMenu 7"/>
                <tkn:RadMenuItem Header="SubMenu 8"/>
                <tkn:RadMenuItem Header="SubMenu 9"/>
                <tkn:RadMenuItem Header="SubMenu 10"/>
                <tkn:RadMenuItem Header="SubMenu 11"/>
                <tkn:RadMenuItem Header="SubMenu 12"/>
                <tkn:RadMenuItem Header="SubMenu 13"/>
                <tkn:RadMenuItem Header="SubMenu 14"/>
                <tkn:RadMenuItem Header="SubMenu 15"/>
            </tkn:RadMenuItem>
        </tkn:RadMenu>
  </Grid>

[Konstantina]

Hello troy,

Straight to your question. To make the sub-menus wrap you have to also set the style to the MenuItems. Attached is a simple project which illustrates how this is made.

If you have any further questions please feel free to ask again.

All the best,
Konstantina
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.

[Sébastien]

Hello Telerik,

I am trying to set the following in the code behind,

<Style x:Key="ItemStyle" TargetType="telerik:RadMenuItem">
    <Setter Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
            <!-- set different MaxHeight to control the size of the menu -->
                <telerik:RadWrapPanel Orientation="Vertical" MaxHeight="300" />
                    </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
</Style>

I created a new RadWrapPanel with the Orientation set to Horizontal and the MaxHeight set to 300.

I created a new ItemsPanelTemplate and I need to set the RadWrapPanel in the ItemsPanelTemplate but I do not know how to set this

Since the only function attached to the ItemsPanelTemplate is SetValue(DependencyProperty,value);

RadMenuItem

 

 

subMenu = new RadMenuItem();

 

 

 

RadWrapPanel rwp = new RadWrapPanel()

 

{

Orientation =

 

Orientation.Horizontal,

 

MaxHeight = 300

};

 

 

 

 

ItemsPanelTemplate itmTmplt = new ItemsPanelTemplate();

 

 

 

//how should I set the RadWrapPanel in the ItemsPanelTemplate ??

 

subMenu.SetValue(

 

RadMenuItem.ItemsPanelProperty, itmTmplt);

 

Can you assist??

Regards