WPF MenuItem MouseOver 不会改变背景颜色

Question

如下图所示，我在后续XAML中使用的style成功地将菜单项的默认背景色和前景色分别更改为蓝色和白色。但是在鼠标悬停时，它不会将MenuItem 的background color 更改为浅蓝色（而是保持鼠标悬停的默认颜色）。我可能在这里遗漏了什么，我们该如何解决这个问题？我尝试了this 和this 帖子的解决方案，但仍然没有运气。

菜单快照

<Menu>
    <MenuItem Header="_File" Background="{DynamicResource MahApps.Brushes.Accent}" Width="32" Height="30">
        <MenuItem.Resources>
        <Style BasedOn="{StaticResource MahApps.Styles.MenuItem}" TargetType="MenuItem">
            <Setter Property="Background" Value="{StaticResource MahApps.Brushes.Accent}"/>
            <Setter Property="Foreground" Value="{StaticResource MahApps.Brushes.IdealForeground}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type MenuItem}">
                        <Grid Background="{TemplateBinding Background}">
                            <MenuItem Header="{TemplateBinding Header}" />
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" Value="{StaticResource MahApps.Brushes.Badged.Background}"/>
                            </Trigger>
                            </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
                </Setter>
            </Style>
        </MenuItem.Resources>
        <MenuItem Header="_New" />
        <MenuItem Header="_Open" />
        <MenuItem Header="_Save" />
        <Separator />
        <MenuItem Header="_Exit" />
    </MenuItem>
</Menu>

更新

我已经上传了这个非常基本的 WPF 示例项目here - 以防有人想测试他/她的建议。此文件上传链接将在 30 天后过期。

Answer 1

你有两种方法：

• 不要在模板中使用<MenuItem Header="{TemplateBinding Header}" />，而是使用自定义模板。
  如果您像这样更改 ControlTemplate：

<mah:MetroWindow.Resources>
    <ControlTemplate x:Key="MenuItemTemplate"
                     TargetType="{x:Type MenuItem}">
        <Grid Background="{TemplateBinding Background}">
            <TextBlock Text="{TemplateBinding Header}"/>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="{StaticResource MahApps.Brushes.Badged.Background}"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    
    <Style BasedOn="{StaticResource MahApps.Styles.MenuItem}" 
           TargetType="MenuItem"
           x:Key="MenuStyle">
        <Setter Property="Background" Value="{StaticResource MahApps.Brushes.Accent}"/>
        <Setter Property="Foreground" Value="{StaticResource MahApps.Brushes.IdealForeground}"/>        
    </Style>    
    
</mah:MetroWindow.Resources>

<Grid>
    <Menu>
        <MenuItem Header="_File"
                  Background="{DynamicResource MahApps.Brushes.Accent4}"
                  Width="60"
                  Height="30">
            <MenuItem.Resources>
                <Style TargetType="{x:Type MenuItem}" BasedOn="{StaticResource MenuStyle}"/>
            </MenuItem.Resources>
            <MenuItem Header="_New" Template="{StaticResource MenuItemTemplate}"/>
            <MenuItem Header="_Open" Template="{StaticResource MenuItemTemplate}"/>
            <MenuItem Header="_Save" Template="{StaticResource MenuItemTemplate}"/>
            <Separator />
            <MenuItem Header="_Exit" Template="{StaticResource MenuItemTemplate}" />
        </MenuItem>
    </Menu>
</Grid>

你会看到鼠标悬停的背景变化

• 使用默认模板，但自定义鼠标悬停颜色。在资源中定义SelectionFill刷。如果您需要为应用程序使用设置颜色Application ResourceDictionary
  将MenuStyle 应用于子项_File

<mah:MetroWindow.Resources>
    <SolidColorBrush x:Key="MahApps.Brushes.MenuItem.SelectionFill" Color="White" />
    
    <Style BasedOn="{StaticResource MahApps.Styles.MenuItem}" 
           TargetType="MenuItem"
           x:Key="MenuStyle">
        <Setter Property="Background" Value="{StaticResource MahApps.Brushes.Accent}"/>
        <Setter Property="Foreground" Value="{StaticResource MahApps.Brushes.IdealForeground}"/>        
    </Style>
</mah:MetroWindow.Resources>

<Grid>
    <Menu>
        <MenuItem Header="_File"
                  Background="{DynamicResource MahApps.Brushes.Accent2}"
                  Width="60"
                  Height="30">
            <MenuItem.Resources>
                <Style TargetType="{x:Type MenuItem}" BasedOn="{StaticResource MenuStyle}" />
            </MenuItem.Resources>
            <MenuItem Header="_New" />
            <MenuItem Header="_Open"/>
            <MenuItem Header="_Save" />
            <Separator />
            <MenuItem Header="_Exit" />
        </MenuItem>
    </Menu>
</Grid>

您可以查看MenuItem样式here
触发IsHighlighted改变选择样式。

<Trigger Property="IsHighlighted" Value="True">
   <Setter TargetName="Bg" Property="Fill" Value="{DynamicResource MahApps.Brushes.MenuItem.SelectionFill}" />
   <Setter TargetName="Bg" Property="Stroke" Value="{DynamicResource MahApps.Brushes.MenuItem.SelectionStroke}" />
</Trigger>