Question

我试图删除MenuItem中图标和标题之间的垂直线：

我设法发现我应该使用Blend并在其中编辑菜单项。所以，当我右键单击第一个MenuItem并选择Edit Template - ＆gt;编辑副本...它显示了包含PART_Popup的模板。 PART_Popup中的矩形是我需要删除的：

<Rectangle x:Name="Rectangle"
           Fill="#FFD7D7D7"
           HorizontalAlignment="Left"
           Margin="29,2,0,2"
           Width="1"/>

要在CSS中修复它，我可能会做类似.Menu .Rectangle {display：none; }。有没有办法在WPF中做这样的事情？像

这样的东西

    <Style TargetType="{x:Type MenuItem}">
        <Setter Property="Template.PART_Popup.Rectangle.Display"
                Value="none"/>
    </Style>

Answer 1

基本上，混合 - 编辑模板方法不仅仅是一种理解现有模板的方法，但它确实是进行此类更改的正确方法。只需注释掉或删除不需要的矩形，然后将自定义样式应用到菜单中。

<ControlTemplate x:Key="{ComponentResourceKey ResourceId=TopLevelHeaderTemplateKey, TypeInTargetAssembly={x:Type MenuItem}}" TargetType="{x:Type MenuItem}">
    <Grid SnapsToDevicePixels="true">
        <!-- Some other stuff -->

        <Popup x:Name="PART_Popup" AllowsTransparency="true" Focusable="false" HorizontalOffset="-2" IsOpen="{Binding IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}" PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}" Placement="Right" VerticalOffset="-3">
            <Themes:SystemDropShadowChrome x:Name="Shdw" Color="Transparent">
                <Border x:Name="SubMenuBorder" BorderBrush="#FF959595" BorderThickness="1" Background="{StaticResource SubMenuBackgroundBrush}">
                    <ScrollViewer x:Name="SubMenuScrollViewer" Margin="1,0" Style="{DynamicResource {ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly={x:Type FrameworkElement}}}">
                        <Grid RenderOptions.ClearTypeHint="Enabled">
                            <Canvas HorizontalAlignment="Left" Height="0" VerticalAlignment="Top" Width="0">
                                <Rectangle x:Name="OpaqueRect" Fill="{StaticResource SubMenuBackgroundBrush}" Height="{Binding ActualHeight, ElementName=SubMenuBorder}" Width="{Binding ActualWidth, ElementName=SubMenuBorder}"/>
                            </Canvas>
                            <Rectangle Fill="#F1F1F1" HorizontalAlignment="Left" Margin="1,2" RadiusY="2" RadiusX="2" Width="28"/>

                            <!-- Part to be removed -->

                            <!--
                            <Rectangle Fill="#E2E3E3" HorizontalAlignment="Left" Margin="29,2,0,2" Width="1"/>
                            <Rectangle Fill="White" HorizontalAlignment="Left" Margin="30,2,0,2" Width="1"/>
                            -->
                            <ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Cycle" Grid.IsSharedSizeScope="true" Margin="2" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" KeyboardNavigation.TabNavigation="Cycle"/>
                        </Grid>
                    </ScrollViewer>
                </Border>
            </Themes:SystemDropShadowChrome>
        </Popup>

   <!-- More other stuff -->

您必须对SubmenuHeaderTemplateKey重复相同的更改：

<ControlTemplate x:Key="{ComponentResourceKey ResourceId=SubmenuHeaderTemplateKey, TypeInTargetAssembly={x:Type MenuItem}}" TargetType="{x:Type MenuItem}">
    <!-- Same change as above -->

如您所见，矩形没有名称，也没有绑定到控件属性，因此可能无需新模板更改它们，但这不是最好的方法。

您可以将样式（让我们称之为MenuItemStyle1）应用于菜单的所有菜单项，方法是使其成为本地隐式样式：

<Menu>
    <Menu.Resources>
        <Style TargetType="{x:Type MenuItem}" BasedOn="{StaticResource MenuItemStyle1}"/>
    </Menu.Resources>
    <MenuItem Header="MenuItem">
        <MenuItem Header="MenuItem"/>
        <MenuItem Header="MenuItem">
            <MenuItem Header="SubMenu"/>
        </MenuItem>
    </MenuItem>
</Menu>

删除WPF MenuItem中图标和标题之间的垂直线

1 个答案: