Question

我试图在分割按钮下面有一个下拉菜单。其中一些menuItem应该有子菜单项。如果您想要一个示例，请单击Firefox中的书签按钮（右上角）。

我无法使用Menu，因为它总是水平定向。所以我选择了一个stackpanel：

<Window x:Class="WpfApplication3.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
    Title="MainWindow" Height="350" Width="525">
<Grid>


    <xctk:SplitButton Content="SplitButton" BorderThickness="1" BorderBrush="Black" Margin="0,0,408,290">
        <xctk:SplitButton.DropDownContent>
            <StackPanel Width="161" HorizontalAlignment="Left">


                <MenuItem Header="MenuItem1" HorizontalAlignment="Left" Width="517">
                    <MenuItem.Items>
                        <MenuItem Header="submenuItem1"/>
                        <MenuItem Header="submenuItem2"/>                            
                    </MenuItem.Items>

                </MenuItem>
                <MenuItem Header="MenuItem2"/>
                <MenuItem Header="MenuItem3"/>

            </StackPanel>                   
        </xctk:SplitButton.DropDownContent>

    </xctk:SplitButton>
</Grid>

这里的问题是子菜单项没有显示出来。他们甚至没有旁边的小箭头。你可以在没有SplitButton的情况下做到这一点，只需离开stackpanel及其中的所有内容，你就会遇到同样的问题。我已尝试将父菜单项放在其自己的标记中，但我希望子菜单项显示在其父级的右侧（就像firefox示例：假设您的firefox窗口未最大化，并且您已允许足够的屏幕空间，以显示项目）。

Answer 1

您使用MenuItem控件的方式是错误的，它应该托管在Menu控件或其他MenuItem内。

至于你的问题的解决方案，有两个。第一个是编写一个自定义控件，重用ContextMenu来托管菜单项，你会写这样的东西：

    <m:SplitButton Content="Split Button" Placement="Bottom">
        <MenuItem Header="MenuItem 1"/> 
        <MenuItem Header="MenuItem 2"> 
             <MenuItem Header="MenuItem 1"/> 
             <MenuItem Header="MenuItem 2"/> 
        </MenuItem>
    </m:SplitButton

http://www.codeproject.com/Articles/20612/A-WPF-SplitButton

第二种方法是在Menu内托管DropDownContent控件并重新设置所有内容，将会有很多xaml标记。

Menu控件很容易重新设置样式，您唯一需要做的就是确保菜单项垂直显示而不是水平显示，使用以下标记：

    <Style TargetType="Menu">
        <Setter Property="ItemsPanel">
            <Setter.Value>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Vertical" IsItemsHost="True" />
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>
    </Style>

最难的部分是MenuItems样式，它们的样式基于Role属性。它可以有四个可能的值：

TopLevelHeader：具有子菜单项的Menu的直接子项。
TopLevelItem：没有子菜单项的Menu的直接子项。
SubmenuHeader：MenuItem的直接子项，包含子菜单项。
子菜单：MenuItem的直接子项，没有子菜单项。

此致

带有菜单项和子菜单项的Xceed splitbutton

1 个答案: