tags:

views:

492

answers:

1

Whenever I attach a DataTemplate to a MenuItem, each generated menu item gets an extra space on the left side. This extra space looks as wide as the space reserved for the check, which I use. Building a menu manually without a DataTemplate doesn't add this extra space. As an extra wrinkle, if I click on this extra space the menu item goes away but no click event is generated. I don't know why it's adding this extra space. Any ideas?

my xaml code couldn't be more simpler:

Menu with the described extra spaces:

<Menu>
    <MenuItem Header="Enemies" ItemsSource="{Binding AvailableEnemyClasses}">
        <MenuItem.ItemTemplate>
            <DataTemplate>
                <MenuItem Header="{Binding}">
                </MenuItem>
            </DataTemplate>
        </MenuItem.ItemTemplate>
    </MenuItem>
</Menu>

Menu without extra spaces:

<Menu>
    <MenuItem Header="Utilities" >
        <MenuItem Header="Enemy01"/>
        <MenuItem Header="Enemy02"/>
        <MenuItem Header="Enemy03"/>
    </MenuItem>
</Menu>
+3  A: 

It's because the visual tree produced by your DataTemplate will be wrapped in a container - in this case, a MenuItem. Therefore, you actually have a MenuItem within a MenuItem, which explains the extra space and the lack of interactivity. There's no need to include the MenuItem in your ItemTemplate.

Your example might instead be written as:

<Menu>
    <MenuItem Header="Enemies" ItemsSource="{Binding AvailableEnemyClasses}">
        <MenuItem.ItemTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding}"/>
            </DataTemplate>
        </MenuItem.ItemTemplate>
    </MenuItem>
</Menu>

Or, perhaps more succinctly:

<Menu>
    <MenuItem Header="Enemies" ItemsSource="{Binding AvailableEnemyClasses}">
        <MenuItem.ItemContainerStyle>
            <Style TargetType="MenuItem">
                <Setter Property="Header" Value="{Binding}"/>
                <Setter Property="IsChecked">
                    <Setter.Value>
                        <MultiBinding Converter="{StaticResource YourConverter}">
                            <Binding .../>
                            <Binding .../>
                        </MultiBinding>
                    </Setter.Value>
                </Setter>
            </Style>
        </MenuItem.ItemContainerStyle>
    </MenuItem>
</Menu>

HTH, Kent

Kent Boogaart
Thanks for your answer! I had another question: With an ItemContainerStyle, how would I bind the MenuItem's IsChecked property to a multibinding?
Steve the Plant
No problem. That should probably be a separate question, but I updated my answer to show you how.
Kent Boogaart
Ah, now I understand. Thanks Kent!
Steve the Plant