如何在WPF中为菜单项正确创建子菜单

Question

我目前正在尝试在WPF / XAML中设置我的MenuItem对象的样式，我无法弄清楚如何输出MenuItem的子菜单。 要清楚，这是我追求的事情：

这就是我目前设置MenuItem的方式：

<Style TargetType="{x:Type MenuItem}">
    <Setter Property="Background" Value="{StaticResource GridLightColour}"/>
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="BorderBrush" Value="Transparent"/>
    <Setter Property="FontSize" Value="15"/>
    <Setter Property="FontFamily" Value="{StaticResource Exo2Light}"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="ScrollViewer.PanningMode" Value="Both"/>

    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type MenuItem}">
                <Grid SnapsToDevicePixels="true">
                    <DockPanel>
                        <Border x:Name="ContentBorder" BorderThickness="1" BorderBrush="{StaticResource GridLightColour}" Background="{StaticResource GridLightColour}">
                            <ContentPresenter x:Name="Content" ContentSource="Header" Margin="7,0,0,0" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                        </Border>
                    </DockPanel>
                    <Popup x:Name="Popup" AllowsTransparency="true" Focusable="false" HorizontalOffset="0" IsOpen="{Binding IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}" PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}" Placement="Bottom" VerticalOffset="-1">
                        <Border BorderThickness="0" BorderBrush="{StaticResource ButtonColour}" Background="{StaticResource GridLightColour}">
                            <ScrollViewer x:Name="SubMenuScrollViewer" CanContentScroll="true" Style="{DynamicResource {ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly={x:Type FrameworkElement}}}">
                                <Grid RenderOptions.ClearTypeHint="Enabled">
                                    <ItemsPresenter x:Name="ItemsPresenter" Grid.Column="0" KeyboardNavigation.DirectionalNavigation="Cycle" Grid.IsSharedSizeScope="true" Margin="3" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" KeyboardNavigation.TabNavigation="Cycle"/>
                                </Grid>
                            </ScrollViewer>
                        </Border>
                    </Popup>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="{StaticResource MenuButtonMouseOverColour}" TargetName="ContentBorder"/>
                    </Trigger>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="Foreground" Value="{StaticResource ButtonMouseOverColour}"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

这样做最好的方法是什么？

Answer 1

默认情况下，默认的MenuItem已经处理了这种嵌套。 无需覆盖控件的模板即可完成此操作。

<DockPanel>
    <Menu DockPanel.Dock="Top">
        <MenuItem Header="File">
            <MenuItem Header="Open">
                <MenuItem Header="aaaaaaa" />
                <MenuItem Header="bbbbbbbb" />
                <MenuItem Header="ccccc" />
            </MenuItem>
            <MenuItem Header="Close" />
            <MenuItem Header="quit" />
        </MenuItem>
        <MenuItem Header="Edit">
            <MenuItem Header="Cut" />
            <MenuItem Header="Copy" />
            <MenuItem Header="Paste" />
        </MenuItem>
    </Menu>
    <Grid />
</DockPanel>

产生这个结果：

你可以随意拿走这个，只需保持嵌套物品......

Answer 2

除非你是XAML忍者，否则使用任何模板的最佳方法是从提取默认模板开始。

因为当你开始做这种事情时，完全打破控制是非常容易的。 模板完全取代了构成您控制权的所有内容。 特别是，一旦完成，请务必确保任何contentpresenter或命名部分仍在那里。

一步步：

将所需类型的控件（menuitem）添加到视图中。

选择它。

在属性窗口中找到杂项组。

向下滚动到模板。

单击右侧的小方框。

选择转换为新资源。

您可以发现需要为某些模板添加对东西的引用。

在任何情况下，确保工作。

您现在开始使用工作模板（而不是损坏的模板）。

做一个小改动并测试。

重复。

通过一个小小的婴儿步骤一次爬上你的要求。

也。

而不是在代码中定义菜单项，而是从绑定的分层集合中模板化它们。