WPF XAML：鼠标悬停时按钮的背景颜色不会改变[重复]答案

【问题标题】：WPF XAML: Button's background color doesn't change on mouseover [duplicate]WPF XAML：鼠标悬停时按钮的背景颜色不会改变[重复]
【发布时间】：2021-10-29 05:42:28
【问题描述】：

我需要在鼠标悬停时更改按钮的文本颜色、光标和背景。我正在尝试通过更改样式来做到这一点，但也尝试将样式触发器直接添加到按钮

<Style.Triggers>
    <Trigger Property="IsMouseOver" Value="True">
        <Setter Property="Background" Value="Black" />
        <Setter Property="Foreground" Value="Black" />
        <Setter Property="Cursor" Value="Hand" />
     </Trigger>
</Style.Triggers>

文本颜色和光标发生变化，但背景颜色保持不变（浅蓝色）。请告诉我可能是什么问题？

Screenshot

完整代码：

<Window x:Class="WpfApp3.MainWindow"
        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:WpfApp3"
        mc:Ignorable="d"
        Title="Заголовок" Height="640" Width="960">
    <Window.Resources>
        <Style TargetType="Button" x:Key="SidebarButton">
            <Style.Setters>
                <Setter Property="Control.FontFamily" Value="Segoe UI" />
                <Setter Property="Control.Background" Value="#333742" />
                <Setter Property="Control.Foreground" Value="White" />
                <Setter Property="Control.BorderThickness" Value="0" />
                <Setter Property="Control.Padding" Value="10" />
            </Style.Setters>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="Black" />
                    <Setter Property="Foreground" Value="Black" />
                    <Setter Property="Cursor" Value="Hand" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid Background="#333742">
        <Grid.RowDefinitions>
            <RowDefinition Height="50"></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="0.2*" MinWidth="150" MaxWidth="200"></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <StackPanel Orientation="Horizontal" Grid.Column="0" Grid.Row="0" Background="#414550"></StackPanel>
        <StackPanel Orientation="Horizontal" Grid.Column="1" Grid.Row="0"></StackPanel>

        <StackPanel Orientation="Vertical" Grid.Column="0" Grid.Row="1" Background="#333742">
            <Border Height="80">
                <TextBlock FontSize="18" Foreground="#fff" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="30">Меню</TextBlock>
            </Border>
            <Button Style="{StaticResource SidebarButton}">Печать кодов</Button>
            <Button Style="{StaticResource SidebarButton}">Настройки</Button>
            <Button Style="{StaticResource SidebarButton}">О программе</Button>
        </StackPanel>
        <StackPanel Orientation="Vertical" Grid.Column="1" Grid.Row="1" Background="#2d3039"></StackPanel>
    </Grid>
</Window>

【问题讨论】：

原因：在按钮默认样式内部使用了模板触发器来更改按钮颜色。模板触发器会覆盖样式触发器的行为。

标签： wpf xaml

【解决方案1】：

您可以在this response找到答案。

你可以这样定义样式：

        <Style TargetType="Button" x:Key="SidebarButton">
            <Style.Setters>
                <Setter Property="FontFamily" Value="Segoe UI" />
                <Setter Property="Background" Value="#333742" />
                <Setter Property="Foreground" Value="White" />
                <Setter Property="BorderThickness" Value="0" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Button">
                            <Border Background="{TemplateBinding Background}" Padding="10">
                                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style.Setters>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="Black" />
                    <Setter Property="Foreground" Value="Black" />
                    <Setter Property="Cursor" Value="Hand" />
                </Trigger>
            </Style.Triggers>
        </Style>

【讨论】：