CODEWITHSUNDEEP
c#wpfxamldata-bindingmenuitem
A.Mills
A.Mills

Reputation: 407

MenuCollection Binding twice MVVM + Databinding Child menu items

As you can see in the image below, you can see 2 hover states. Here is the XAML

<Menu ItemsSource="{Binding Data.MenuCollection}">
    <Menu.ItemTemplate >
        <DataTemplate DataType="MenuItem">
            <MenuItem Header="{Binding Header}" Command="{Binding Command}" ItemsSource="{Binding Children}"/>
        </DataTemplate>
    </Menu.ItemTemplate>
</Menu>

The Collection of data works on the header. However I can't get the Children nodes to appear.

public void CreateTempMenuList()
{
    MenuCollection = new ObservableCollection<MenuItem>()
    {
        new MenuItem()
        {
            Header = "File",
            Children = new ObservableCollection<MenuItem>()
            {
                new MenuItem()
                {
                    Header = "Exit"
                }
            }
        }
    };
}

The MenuItem class is something I created. Each property has a setter that called the OnPropertiesChanged Function. I can add the class if needed, but I am pretty sure thats not the problem.

So my question is. How do i get rid of the 'double' hover. In the image you can see 2 borders. An outer border which i hover over. the hover stays until focused on something else.

My second question is how can i get the child items to work? The itemssource on the menuitem tag could be wrong but its all i could think of.

enter image description here

Upvotes: 0

Views: 154

Answers (2)

AnjumSKhan
AnjumSKhan

Reputation: 9827

To make your current code work, right click your Menu control > Edit Additional Template > Edit ItemContainerStyle > Edit Copy.

And in the generated Style,

Search for this piece of code : 

           <Trigger Property="Role" Value="TopLevelItem">
                <Setter Property="Padding" Value="7,2,8,3"/>
                <Setter Property="Template" Value="{DynamicResource {ComponentResourceKey ResourceId=TopLevelItemTemplateKey, TypeInTargetAssembly={x:Type MenuItem}}}"/>
            </Trigger>

And change Padding to 0 instead of 7,2,8,3 .

Upvotes: 0

mm8
mm8

Reputation: 169150

Define an HierarchicalDataTemplate:

<Menu ItemsSource="{Binding Data.MenuCollection}">
    <Menu.Resources>
        <Style TargetType="MenuItem">
            <Setter Property="Command" Value="{Binding Command}" />
        </Style>
    </Menu.Resources>
    <Menu.ItemTemplate>
        <HierarchicalDataTemplate ItemsSource="{Binding Children}">
            <TextBlock Text="{Binding Header}" />
        </HierarchicalDataTemplate>
    </Menu.ItemTemplate>
</Menu>

A System.Windows.Controls.MenuItem container is implicitly created for each item so you shouldn't add another MenuItem element in the template.

Also make sure that you don't bind to an ObservableCollection<System.Windows.Controls.MenuItem> because the ItemTemplate won't be applied to built-in MenuItem elements.

Upvotes: 1

Related Questions