none
WPF:如何在MenuItem子菜单的模板或样式中取消Ico样式设置?请看正文截图 RRS feed

  • 问题

  • 下图所示,箭头指示处显示的是一个容器,容器中添加了若干控件。

    WPF的MenuItem控件中如何实现如下截图的效果?请大神解答,谢谢。

    2017年10月17日 9:09

答案

  • 你好,

    从截图看, 你可以使用PopUp来处理。

    参考下面的代码:

     private void ExpandButton_Click(object sender, RoutedEventArgs e)
            {
                ExpandButtonPopup.IsOpen = true;
            }
    
            private void ColorButton_Click(object sender, RoutedEventArgs e)
            {
                ColorButtonPopup.IsOpen = true;
            }
    <Window x:Class="wpfAppDemo.wpfMenu.sample2"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:local="clr-namespace:wpfAppDemo.wpfMenu"
            mc:Ignorable="d"
            Title="sample2" Height="600" Width="1000">
        <Window.Resources>
            <ControlTemplate x:Key="InvertedTriangleButtonTemplate" TargetType="{x:Type Button}">
                <Border x:Name="border"
                    Background="Transparent">
                    <Grid>
                        <Viewbox Margin="5">
                            <Path Data="M1000 244.1c-31.8-31.3-83.5-31.3-115.4 0L512 609.5 139.4 244.1c-31.8-31.3-83.5-31.3-115.4 0-32 31.5-32 82.4 0 113.9l430.2 421.9c32 31.3 83.5 31.3 115.6 0L1000 358c32-31.5 32-82.4 0-113.9z" Fill="Black"/>
                        </Viewbox>
                        <ContentPresenter Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                        
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
    
            <ControlTemplate x:Key="CloseButtonTemplate" TargetType="{x:Type Button}">
                <Border x:Name="border"
                    Background="Transparent">
                    <Grid>
                        <Viewbox Margin="5">
                            <Path Data="M961.7408 162.2016 861.7984 62.2592 512 412.0576 162.2016 62.2592 62.2592 162.2016 412.0576 512 62.2592 861.7984 162.2016 961.7408 512 611.9424 861.7984 961.7408 961.7408 861.7984 611.9424 512Z" Fill="Black"/>
                        </Viewbox>
                        <ContentPresenter Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="border" Property="Background" Value="Green"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
            <ControlTemplate x:Key="AddNoteButtonTemplate" TargetType="{x:Type Button}">
                <Border x:Name="border"
                        BorderBrush="Gray"
                        BorderThickness="0.3"
                    Background="Transparent">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="30"/>
                            <ColumnDefinition />                      
                        </Grid.ColumnDefinitions>
                        <Viewbox Grid.Column="0" Margin="5">
                            <Path Data="M1002.91584 593.8176V430.1824H593.8176V21.08416H430.1824V430.1824H21.08416v163.64032H430.1824v409.09312h163.64032V593.8176h409.09312z" Fill="Black"/>
                        </Viewbox>
                        <ContentPresenter Grid.Column="1" Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
    
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="border" Property="Background" Value="Green"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
    
            <ControlTemplate x:Key="ColorButtonTemplate" TargetType="{x:Type Button}">
                <Border x:Name="border"
                        BorderBrush="Gray"
                        BorderThickness="0.3"
                    Background="Transparent">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="30"/>
                            <ColumnDefinition />
                            <ColumnDefinition Width="30"/>
                        </Grid.ColumnDefinitions>
                        <Viewbox Grid.Column="0" Margin="3">
                            <Path Data="M0.010741 0l1023.97851 0 0 1023.97851-1023.97851 0 0-1023.97851Z" Fill="LawnGreen"/>
                        </Viewbox>
                        <ContentPresenter Grid.Column="1" Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
                        <Viewbox Grid.Column="2" Margin="5">
                            <Path Data="M351.452 870.731l362.02400001-362.024-360.92700001-360.927z" Fill="Black"/>
                        </Viewbox>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="border" Property="Background" Value="Green"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
    
            <ControlTemplate x:Key="OpacityButtonTemplate" TargetType="{x:Type Button}">
                <Border x:Name="border"
                        BorderBrush="Gray"
                        BorderThickness="0.3"
                    Background="Transparent">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition  Width="30"/>
                            <ColumnDefinition />
                            <ColumnDefinition Width="30"/>
                        </Grid.ColumnDefinitions>                   
                        <ContentPresenter Grid.Column="1" Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
                        <Viewbox Grid.Column="2" Margin="5">
                            <Path Data="M351.452 870.731l362.02400001-362.024-360.92700001-360.927z" Fill="Black"/>
                        </Viewbox>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="border" Property="Background" Value="Green"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Window.Resources>
        <Grid>
            <Grid Background="Green" Height="250" Width="150">
                <Grid.RowDefinitions>             
                    <RowDefinition Height="50"/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Margin="5" FontSize="18" VerticalAlignment="Center" Text="New Note"/>
                    <Button x:Name="ExpandButton" Click="ExpandButton_Click" Template="{StaticResource InvertedTriangleButtonTemplate}" Margin="5,0,5,0" Height="20" Width="20"/>
                    <Popup x:Name="ExpandButtonPopup"
                           AllowsTransparency="True"                       
                           IsOpen="False"
                           Placement="Bottom"               
                           Width="150"                        
                           PlacementTarget="{Binding ElementName=ExpandButton}"
                           PopupAnimation="Slide"
                           StaysOpen="False">
                        <StackPanel Background="White" Orientation="Vertical">                       
                            <Button  Content="New Note" Height="27" Template="{StaticResource AddNoteButtonTemplate}"  />
                            <Button  x:Name="ColorButton" Click="ColorButton_Click" Content="Color" Height="27"  Template="{StaticResource ColorButtonTemplate}" />
                            <Popup x:Name="ColorButtonPopup"
                                   AllowsTransparency="True"      
                                   IsOpen="False"
                                   Placement="Right"                                     
                                   PlacementTarget="{Binding ElementName=ColorButton}"
                                   PopupAnimation="Slide"
                                   StaysOpen="False">
                                <WrapPanel Width="260">
                                    <Button Background="#ff0000" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff4000" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff8000" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ffbf00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ffff00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#bfff00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#80ff00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#40ff00" Height="25" Width="25" Margin="3"></Button>
    
                                    <Button Background="#00ff00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#00ff40" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#00ff80" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#00ffbf" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#00ffff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#00bfff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#80ff00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#0040ff" Height="25" Width="25" Margin="3"></Button>
    
                                    <Button Background="#0000ff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#4000ff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#8000ff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#bf00ff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff00ff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff00bf" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff0080" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff0040" Height="25" Width="25" Margin="3"></Button>
    
    
                                </WrapPanel>
                            </Popup>
                            <Button Content="Opacity" Height="27"  Template="{StaticResource OpacityButtonTemplate}" />
                        </StackPanel>
                    </Popup>
                    <Button Template="{StaticResource CloseButtonTemplate}"  Margin="5,0,0,0"  Height="20" Width="20"></Button>
                </StackPanel>
            </Grid>
        </Grid>
    </Window>

    希望有帮助。

    Best Regards,

    Bob


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.


    2017年10月18日 2:54
    版主
  • 你好,

    另外,你可以重写MenuItem的模板,下面是默认的模板,你可以在默认模板的基础上修改成你需要的样式。

     <ControlTemplate x:Key="MenuItemControlTemplate1" TargetType="{x:Type MenuItem}">
                <Border x:Name="templateRoot" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                    <Grid Margin="-1">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition MinWidth="22" SharedSizeGroup="MenuItemIconColumnGroup" Width="Auto"/>
                            <ColumnDefinition Width="13"/>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="30"/>
                            <ColumnDefinition SharedSizeGroup="MenuItemIGTColumnGroup" Width="Auto"/>
                            <ColumnDefinition Width="20"/>
                        </Grid.ColumnDefinitions>
                        <ContentPresenter x:Name="Icon" Content="{TemplateBinding Icon}" ContentSource="Icon" HorizontalAlignment="Center" Height="16" Margin="3" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Center" Width="16"/>
                        <Border x:Name="GlyphPanel" BorderBrush="#FF26A0DA" BorderThickness="1" Background="#3D26A0DA" Height="22" Margin="-1,0,0,0" Visibility="Hidden" VerticalAlignment="Center" Width="22">
                            <Path x:Name="Glyph" Data="{DynamicResource Ũ}" Fill="#FF212121" FlowDirection="LeftToRight" Height="11" Width="9"/>
                        </Border>
                        <ContentPresenter ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" Grid.Column="2" ContentStringFormat="{TemplateBinding HeaderStringFormat}" ContentSource="Header" HorizontalAlignment="Left" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Center"/>
                        <TextBlock Grid.Column="4" Margin="{TemplateBinding Padding}" Opacity="0.7" Text="{TemplateBinding InputGestureText}" VerticalAlignment="Center"/>
                        <Path x:Name="RightArrow" Grid.Column="5" Data="M0,0L4,3.5 0,7z" Fill="#FF212121" HorizontalAlignment="Left" Margin="10,0,0,0" VerticalAlignment="Center"/>
                        <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">
                            <Border x:Name="SubMenuBorder" BorderBrush="#FF999999" BorderThickness="1" Background="#FFF0F0F0" Padding="2">
                                <ScrollViewer x:Name="SubMenuScrollViewer" 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="{Binding Background, ElementName=SubMenuBorder}" Height="{Binding ActualHeight, ElementName=SubMenuBorder}" Width="{Binding ActualWidth, ElementName=SubMenuBorder}"/>
                                        </Canvas>
                                        <Rectangle Fill="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" HorizontalAlignment="Left" Margin="29,2,0,2" Width="1"/>
                                        <ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Cycle" Grid.IsSharedSizeScope="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" KeyboardNavigation.TabNavigation="Cycle"/>
                                    </Grid>
                                </ScrollViewer>
                            </Border>
                        </Popup>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsSuspendingPopupAnimation" Value="True">
                        <Setter Property="PopupAnimation" TargetName="PART_Popup" Value="None"/>
                    </Trigger>
                    <Trigger Property="Icon" Value="{x:Null}">
                        <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
                    </Trigger>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="Visibility" TargetName="GlyphPanel" Value="Visible"/>
                        <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
                    </Trigger>
                    <Trigger Property="IsHighlighted" Value="True">
                        <Setter Property="Background" TargetName="templateRoot" Value="Transparent"/>
                        <Setter Property="BorderBrush" TargetName="templateRoot" Value="#FF26A0DA"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="TextElement.Foreground" TargetName="templateRoot" Value="#FF707070"/>
                        <Setter Property="Fill" TargetName="Glyph" Value="#FF707070"/>
                        <Setter Property="Fill" TargetName="RightArrow" Value="#FF707070"/>
                    </Trigger>
                    <Trigger Property="CanContentScroll" SourceName="SubMenuScrollViewer" Value="False">
                        <Setter Property="Canvas.Top" TargetName="OpaqueRect" Value="{Binding VerticalOffset, ElementName=SubMenuScrollViewer}"/>
                        <Setter Property="Canvas.Left" TargetName="OpaqueRect" Value="{Binding HorizontalOffset, ElementName=SubMenuScrollViewer}"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        

    Best Regards,

    Bob


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    2017年10月18日 6:11
    版主

全部回复

  • 我的xaml样式如下,无法实现上述截图中的效果,无法去掉MenuItem子菜单的Ico显示区域:

    <Window.Resources>
            <!--MenuItem控件模板-->
            <ControlTemplate x:Key="mymenuitemcontroltemplate" TargetType="{x:Type MenuItem}">
                <Border>
                    <Grid>
                        <!--<ContentPresenter ContentSource="Header"/>-->
                        <!--<Popup IsOpen="{TemplateBinding IsSubmenuOpen}" Placement="Bottom" AllowsTransparency="True">
                            <Border Margin="1" Background="Chocolate">
                                <StackPanel IsItemsHost="True">
                                </StackPanel>
                            </Border>
                        </Popup>-->
                        <StackPanel IsItemsHost="True">
                        </StackPanel>
                    </Grid>
                </Border>
            </ControlTemplate>
        </Window.Resources>
        <Grid>
            <Menu HorizontalAlignment="Left" Height="19" Margin="50,50,0,0" VerticalAlignment="Top" Width="38">
                <MenuItem Header="1111">
                    <MenuItem Header="22222">
                        <MenuItem Template="{StaticResource mymenuitemcontroltemplate}" Height="50">
                            <Grid Height="50">
                                <WrapPanel >
                                    <Button Content="111111"/>
                                    <Button Content="555555"/>
                                </WrapPanel>
                            </Grid>
                        </MenuItem>
                    </MenuItem>
                </MenuItem>
            </Menu>
        </Grid>


    2017年10月17日 9:32
  • 你好,

    从截图看, 你可以使用PopUp来处理。

    参考下面的代码:

     private void ExpandButton_Click(object sender, RoutedEventArgs e)
            {
                ExpandButtonPopup.IsOpen = true;
            }
    
            private void ColorButton_Click(object sender, RoutedEventArgs e)
            {
                ColorButtonPopup.IsOpen = true;
            }
    <Window x:Class="wpfAppDemo.wpfMenu.sample2"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:local="clr-namespace:wpfAppDemo.wpfMenu"
            mc:Ignorable="d"
            Title="sample2" Height="600" Width="1000">
        <Window.Resources>
            <ControlTemplate x:Key="InvertedTriangleButtonTemplate" TargetType="{x:Type Button}">
                <Border x:Name="border"
                    Background="Transparent">
                    <Grid>
                        <Viewbox Margin="5">
                            <Path Data="M1000 244.1c-31.8-31.3-83.5-31.3-115.4 0L512 609.5 139.4 244.1c-31.8-31.3-83.5-31.3-115.4 0-32 31.5-32 82.4 0 113.9l430.2 421.9c32 31.3 83.5 31.3 115.6 0L1000 358c32-31.5 32-82.4 0-113.9z" Fill="Black"/>
                        </Viewbox>
                        <ContentPresenter Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                        
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
    
            <ControlTemplate x:Key="CloseButtonTemplate" TargetType="{x:Type Button}">
                <Border x:Name="border"
                    Background="Transparent">
                    <Grid>
                        <Viewbox Margin="5">
                            <Path Data="M961.7408 162.2016 861.7984 62.2592 512 412.0576 162.2016 62.2592 62.2592 162.2016 412.0576 512 62.2592 861.7984 162.2016 961.7408 512 611.9424 861.7984 961.7408 961.7408 861.7984 611.9424 512Z" Fill="Black"/>
                        </Viewbox>
                        <ContentPresenter Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="border" Property="Background" Value="Green"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
            <ControlTemplate x:Key="AddNoteButtonTemplate" TargetType="{x:Type Button}">
                <Border x:Name="border"
                        BorderBrush="Gray"
                        BorderThickness="0.3"
                    Background="Transparent">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="30"/>
                            <ColumnDefinition />                      
                        </Grid.ColumnDefinitions>
                        <Viewbox Grid.Column="0" Margin="5">
                            <Path Data="M1002.91584 593.8176V430.1824H593.8176V21.08416H430.1824V430.1824H21.08416v163.64032H430.1824v409.09312h163.64032V593.8176h409.09312z" Fill="Black"/>
                        </Viewbox>
                        <ContentPresenter Grid.Column="1" Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
    
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="border" Property="Background" Value="Green"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
    
            <ControlTemplate x:Key="ColorButtonTemplate" TargetType="{x:Type Button}">
                <Border x:Name="border"
                        BorderBrush="Gray"
                        BorderThickness="0.3"
                    Background="Transparent">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="30"/>
                            <ColumnDefinition />
                            <ColumnDefinition Width="30"/>
                        </Grid.ColumnDefinitions>
                        <Viewbox Grid.Column="0" Margin="3">
                            <Path Data="M0.010741 0l1023.97851 0 0 1023.97851-1023.97851 0 0-1023.97851Z" Fill="LawnGreen"/>
                        </Viewbox>
                        <ContentPresenter Grid.Column="1" Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
                        <Viewbox Grid.Column="2" Margin="5">
                            <Path Data="M351.452 870.731l362.02400001-362.024-360.92700001-360.927z" Fill="Black"/>
                        </Viewbox>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="border" Property="Background" Value="Green"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
    
            <ControlTemplate x:Key="OpacityButtonTemplate" TargetType="{x:Type Button}">
                <Border x:Name="border"
                        BorderBrush="Gray"
                        BorderThickness="0.3"
                    Background="Transparent">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition  Width="30"/>
                            <ColumnDefinition />
                            <ColumnDefinition Width="30"/>
                        </Grid.ColumnDefinitions>                   
                        <ContentPresenter Grid.Column="1" Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
                        <Viewbox Grid.Column="2" Margin="5">
                            <Path Data="M351.452 870.731l362.02400001-362.024-360.92700001-360.927z" Fill="Black"/>
                        </Viewbox>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="border" Property="Background" Value="Green"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="border" Property="Background" Value="DarkGreen"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Window.Resources>
        <Grid>
            <Grid Background="Green" Height="250" Width="150">
                <Grid.RowDefinitions>             
                    <RowDefinition Height="50"/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Margin="5" FontSize="18" VerticalAlignment="Center" Text="New Note"/>
                    <Button x:Name="ExpandButton" Click="ExpandButton_Click" Template="{StaticResource InvertedTriangleButtonTemplate}" Margin="5,0,5,0" Height="20" Width="20"/>
                    <Popup x:Name="ExpandButtonPopup"
                           AllowsTransparency="True"                       
                           IsOpen="False"
                           Placement="Bottom"               
                           Width="150"                        
                           PlacementTarget="{Binding ElementName=ExpandButton}"
                           PopupAnimation="Slide"
                           StaysOpen="False">
                        <StackPanel Background="White" Orientation="Vertical">                       
                            <Button  Content="New Note" Height="27" Template="{StaticResource AddNoteButtonTemplate}"  />
                            <Button  x:Name="ColorButton" Click="ColorButton_Click" Content="Color" Height="27"  Template="{StaticResource ColorButtonTemplate}" />
                            <Popup x:Name="ColorButtonPopup"
                                   AllowsTransparency="True"      
                                   IsOpen="False"
                                   Placement="Right"                                     
                                   PlacementTarget="{Binding ElementName=ColorButton}"
                                   PopupAnimation="Slide"
                                   StaysOpen="False">
                                <WrapPanel Width="260">
                                    <Button Background="#ff0000" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff4000" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff8000" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ffbf00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ffff00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#bfff00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#80ff00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#40ff00" Height="25" Width="25" Margin="3"></Button>
    
                                    <Button Background="#00ff00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#00ff40" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#00ff80" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#00ffbf" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#00ffff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#00bfff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#80ff00" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#0040ff" Height="25" Width="25" Margin="3"></Button>
    
                                    <Button Background="#0000ff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#4000ff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#8000ff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#bf00ff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff00ff" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff00bf" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff0080" Height="25" Width="25" Margin="3"></Button>
                                    <Button Background="#ff0040" Height="25" Width="25" Margin="3"></Button>
    
    
                                </WrapPanel>
                            </Popup>
                            <Button Content="Opacity" Height="27"  Template="{StaticResource OpacityButtonTemplate}" />
                        </StackPanel>
                    </Popup>
                    <Button Template="{StaticResource CloseButtonTemplate}"  Margin="5,0,0,0"  Height="20" Width="20"></Button>
                </StackPanel>
            </Grid>
        </Grid>
    </Window>

    希望有帮助。

    Best Regards,

    Bob


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.


    2017年10月18日 2:54
    版主
  • 你好,

    另外,你可以重写MenuItem的模板,下面是默认的模板,你可以在默认模板的基础上修改成你需要的样式。

     <ControlTemplate x:Key="MenuItemControlTemplate1" TargetType="{x:Type MenuItem}">
                <Border x:Name="templateRoot" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                    <Grid Margin="-1">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition MinWidth="22" SharedSizeGroup="MenuItemIconColumnGroup" Width="Auto"/>
                            <ColumnDefinition Width="13"/>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="30"/>
                            <ColumnDefinition SharedSizeGroup="MenuItemIGTColumnGroup" Width="Auto"/>
                            <ColumnDefinition Width="20"/>
                        </Grid.ColumnDefinitions>
                        <ContentPresenter x:Name="Icon" Content="{TemplateBinding Icon}" ContentSource="Icon" HorizontalAlignment="Center" Height="16" Margin="3" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Center" Width="16"/>
                        <Border x:Name="GlyphPanel" BorderBrush="#FF26A0DA" BorderThickness="1" Background="#3D26A0DA" Height="22" Margin="-1,0,0,0" Visibility="Hidden" VerticalAlignment="Center" Width="22">
                            <Path x:Name="Glyph" Data="{DynamicResource Ũ}" Fill="#FF212121" FlowDirection="LeftToRight" Height="11" Width="9"/>
                        </Border>
                        <ContentPresenter ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" Grid.Column="2" ContentStringFormat="{TemplateBinding HeaderStringFormat}" ContentSource="Header" HorizontalAlignment="Left" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Center"/>
                        <TextBlock Grid.Column="4" Margin="{TemplateBinding Padding}" Opacity="0.7" Text="{TemplateBinding InputGestureText}" VerticalAlignment="Center"/>
                        <Path x:Name="RightArrow" Grid.Column="5" Data="M0,0L4,3.5 0,7z" Fill="#FF212121" HorizontalAlignment="Left" Margin="10,0,0,0" VerticalAlignment="Center"/>
                        <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">
                            <Border x:Name="SubMenuBorder" BorderBrush="#FF999999" BorderThickness="1" Background="#FFF0F0F0" Padding="2">
                                <ScrollViewer x:Name="SubMenuScrollViewer" 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="{Binding Background, ElementName=SubMenuBorder}" Height="{Binding ActualHeight, ElementName=SubMenuBorder}" Width="{Binding ActualWidth, ElementName=SubMenuBorder}"/>
                                        </Canvas>
                                        <Rectangle Fill="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" HorizontalAlignment="Left" Margin="29,2,0,2" Width="1"/>
                                        <ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Cycle" Grid.IsSharedSizeScope="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" KeyboardNavigation.TabNavigation="Cycle"/>
                                    </Grid>
                                </ScrollViewer>
                            </Border>
                        </Popup>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsSuspendingPopupAnimation" Value="True">
                        <Setter Property="PopupAnimation" TargetName="PART_Popup" Value="None"/>
                    </Trigger>
                    <Trigger Property="Icon" Value="{x:Null}">
                        <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
                    </Trigger>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="Visibility" TargetName="GlyphPanel" Value="Visible"/>
                        <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
                    </Trigger>
                    <Trigger Property="IsHighlighted" Value="True">
                        <Setter Property="Background" TargetName="templateRoot" Value="Transparent"/>
                        <Setter Property="BorderBrush" TargetName="templateRoot" Value="#FF26A0DA"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="TextElement.Foreground" TargetName="templateRoot" Value="#FF707070"/>
                        <Setter Property="Fill" TargetName="Glyph" Value="#FF707070"/>
                        <Setter Property="Fill" TargetName="RightArrow" Value="#FF707070"/>
                    </Trigger>
                    <Trigger Property="CanContentScroll" SourceName="SubMenuScrollViewer" Value="False">
                        <Setter Property="Canvas.Top" TargetName="OpaqueRect" Value="{Binding VerticalOffset, ElementName=SubMenuScrollViewer}"/>
                        <Setter Property="Canvas.Left" TargetName="OpaqueRect" Value="{Binding HorizontalOffset, ElementName=SubMenuScrollViewer}"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        

    Best Regards,

    Bob


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    2017年10月18日 6:11
    版主
  • 感谢回复,正是我想要的效果。
    2017年10月24日 8:51