WPF Submenu for context menu

Question

If the Context menu is "hardcoded" in xaml, then it is easy to add submenus. For example:

<ContextMenu>
    <MenuItem Header="Comm1" Command="{Binding Blabla1}">
        <MenuItem Header="SubComm1" Command="{Binding Blabla2}"></MenuItem>
    </MenuItem>
    <MenuItem Command="Comm2"></MenuItem>
    <MenuItem Command="Comm3"></MenuItem>
</ContextMenu>

This means, that the ContextMenu has three elements (Comm1, Comm2 and Comm3) and Comm1 has submenu SubComm1.

I have made my ContextMenu a bit more flexible:

<ContextMenu ItemsSource="{Binding ContextMenuItemsSource}">
    <ContextMenu.ItemContainerStyle>
        <Style TargetType="MenuItem">
            <Setter Property="Header" Value="{Binding ContextMenuCommandHeader}"></Setter>
            <Setter Property="Command" Value="{Binding ContextMenuCommand}"></Setter>
        </Style>
     </ContextMenu.ItemContainerStyle>
</ContextMenu>

Basically I can have any number of elements in ContextMenu, and any element can have any Command. How can I add submenu to ContextMenu element?

Answer 1

You can set MenuItem.ItemsSource to the nested collection. This will generate the submenu for any menuitem. For this the model backing your MenuItem should have submenuitems collection in it

<ContextMenu ItemsSource="{Binding ContextMenuItemsSource}">
    <ContextMenu.ItemContainerStyle>
        <Style TargetType="MenuItem">
            <Setter Property="ItemsSource" Value="{Binding ContextMenuSubItems}"></Setter>
            <Setter Property="Header" Value="{Binding ContextMenuCommandHeader}"></Setter>
            <Setter Property="Command" Value="{Binding ContextMenuCommand}"></Setter>
        </Style>
     </ContextMenu.ItemContainerStyle>
</ContextMenu>

Similarly you can set the MenuItem.ItemContainerStyle and MenuItem.ItemTemplate to style your submenuitems.