关于c#:如何在WPF的自定义MenuItem控件中设置鼠标悬停触发器?

How to set the mouse over trigger in custom MenuItem Control of WPF?

我有一个MenuItem样式:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<Style TargetType="{x:Type MenuItem}" BasedOn="{StaticResource {x:Type MenuItem}}">
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="{x:Type MenuItem}">
            <Border x:Name="templateRoot" BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}"
                    Height="22" SnapsToDevicePixels="true">
                <Grid Margin="-1">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="4"/>
                        <ColumnDefinition SharedSizeGroup="MenuItemIGTColumnGroup" Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <ContentPresenter x:Name="menuHeaderContainer" Grid.Column="0"
                                        ContentSource="Header" HorizontalAlignment="Left"
                                        Margin="{TemplateBinding Padding}" RecognizesAccessKey="True"
                                        SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                        VerticalAlignment="Center"/>
                    <TextBlock x:Name="menuGestureText" Grid.Column="2"
                                Margin="{TemplateBinding Padding}" Opacity="0.7" Text="{TemplateBinding InputGestureText}"
                                VerticalAlignment="Center"/>
                </Grid>
            </Border>
            <ControlTemplate.Triggers>
                <Trigger Property="IsHighlighted" Value="True">
                    <Setter Property="Background" TargetName="templateRoot" Value="Black"/>
                </Trigger>
                <MultiTrigger>
                    <MultiTrigger.Conditions>
                        <Condition Property="IsHighlighted" Value="True"/>
                        <Condition Property="IsEnabled" Value="False"/>
                    </MultiTrigger.Conditions>
                    <Setter Property="Background" TargetName="templateRoot" Value="Red"/>
                    <Setter Property="BorderBrush" TargetName="templateRoot" Value="Black"/>
                </MultiTrigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Setter.Value>
</Setter>

我的控制权是:

1
2
3
4
5
6
<Grid>
<Menu VerticalAlignment="Center" HorizontalAlignment="Center">
    <MenuItem Header="Header">
        <MenuItem Header="Second Level"/>
    </MenuItem>
</Menu>

当菜单项上的鼠标悬停时,我愿意设置新的样式,背景将变为黑色。我的样式有效,但仅适用于第二级菜单项。

将鼠标悬停在第一级菜单项上时,它仍是默认样式:
the

为什么我的样式不能在一级菜单项上使用?


顶级菜单项和子菜单项的控制模板是不同的。顶层MenuItem还需要定义子菜单项将如何弹出。

您可以为每种菜单项类型编写多个ControlTemplate。然后使用以下样式设置MenuItem样式:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
 <Style x:Key="{x:Type MenuItem}" TargetType="MenuItem">
  <Setter Property="OverridesDefaultStyle" Value="True"/>
  <Style.Triggers>
    <Trigger Property="Role" Value="TopLevelHeader">
      <Setter Property="Template" Value="{StaticResource {x:Static MenuItem.TopLevelHeaderTemplateKey}}"/>
      <Setter Property="Grid.IsSharedSizeScope" Value="true"/>
    </Trigger>
    <Trigger Property="Role" Value="TopLevelItem">
      <Setter Property="Template"
              Value="{StaticResource {x:Static MenuItem.TopLevelItemTemplateKey}}"/>
    </Trigger>
    <Trigger Property="Role" Value="SubmenuHeader">
      <Setter Property="Template"
              Value="{StaticResource {x:Static MenuItem.SubmenuHeaderTemplateKey}}"/>
    </Trigger>
    <Trigger Property="Role" Value="SubmenuItem">
      <Setter Property="Template"
              Value="{StaticResource {x:Static MenuItem.SubmenuItemTemplateKey}}"/>
    </Trigger>
  </Style.Triggers>
</Style>

有关更多详细信息,请参见此帖子