在鼠标悬停时更改按钮的背景[重复]

Question

当鼠标悬停在两个按钮上时，我必须更改它们的颜色，我已经搜索并遵循了许多教程但无法使其工作。

这是应用的样式：

<Window.Resources>
    <Style x:Key="btnStyleBase" TargetType="Button">
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="FontFamily" Value="{StaticResource FontAwesome}"/>
        <Setter Property="Cursor" Value="Hand"/>
        <Setter Property="Foreground" Value="White"/>
        <Setter Property="Width" Value="42"/>
        <Setter Property="Height" Value="40"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="FontSize" Value="24"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Button.Background" Value="Transparent"/>
            </Trigger>
        </Style.Triggers>
    </Style>

    <Style x:Key="btnStyleClose" TargetType="{x:Type Button}" BasedOn="{StaticResource btnStyleBase}">
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Button.Background" Value="Red"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</Window.Resources>

这是实现样式的按钮：

<Button Name="btn1" Style="{StaticResource btnStyleBase}" Click="..." />
<Button Name="btn2" Style="{StaticResource btnStyleClose}" Click="..." />

“IsMouseOver”属性被触发，但即使它可以应用任何其他设置器，按钮的背景仍保持默认浅蓝色

Answer 1

默认情况下，WPF 控件有一个 ControlTemplate，它在操作系统后面定义。

就像 Web 开发一样，每当您在不同版本的 Microsoft Windows（Win7、Win8、Win10、...）上运行应用程序时，您都会看到每个控件的不同显示

如果你想摆脱这种变化，你必须为每个控件重写 ControlTemplate。

对于 Button，您可以使用它（并根据需要更改它）： [这个模板还有颜色变化的动画，你可以自定义]

 <Style TargetType="Button" x:Key="ButtonBaseStyle">
     <Setter Property="Padding" Value="12,6"/>
     <Setter Property="BorderThickness" Value="1"/>
 </Style>

 <Style TargetType="Button" x:Key="PrimaryButton" BasedOn="{StaticResource ButtonBaseStyle}">
     <Setter Property="BorderBrush" Value="#2e6da4"/>
     <Setter Property="Background" Value="#337ab7"/>
     <Setter Property="Foreground" Value="#fff"/>
     <Setter Property="Template">
         <Setter.Value>
             <ControlTemplate TargetType="Button">
                 <Border CornerRadius="4" Name="container" Cursor="Hand" Padding="{TemplateBinding Padding}" 
                         BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}"
                         Background="{TemplateBinding Background}">
                     <ContentPresenter ContentSource="{TemplateBinding Content}" 
                         ContentTemplate="{TemplateBinding ContentTemplate}"
                         VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                         HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"/>
                     <VisualStateManager.VisualStateGroups>
                         <VisualStateGroup>
                             <VisualState Name="Normal">

                             </VisualState>
                             <VisualState Name="MouseOver">
                                 <Storyboard>
                                     <ColorAnimation Storyboard.TargetName="container" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" 
                                                     Duration="0:0:0.02" To="#286090"></ColorAnimation>
                                     <ColorAnimation Storyboard.TargetName="container" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" 
                                                     Duration="0:0:0.02" To="#204d74"></ColorAnimation>
                                 </Storyboard>
                             </VisualState>
                             <VisualState Name="Pressed">
                                 <Storyboard>
                                     <ColorAnimation Storyboard.TargetName="container" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" 
                                                     Duration="0:0:0.02" To="#204d74"></ColorAnimation>
                                     <ColorAnimation Storyboard.TargetName="container" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" 
                                                     Duration="0:0:0.02" To="#122b40"></ColorAnimation>
                                 </Storyboard>
                             </VisualState>
                             <VisualState Name="Disabled">
                                 <Storyboard>
                                     <ColorAnimation Storyboard.TargetName="container" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" 
                                                     Duration="0:0:0.02" To="#337ab7"></ColorAnimation>
                                     <ColorAnimation Storyboard.TargetName="container" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" 
                                                     Duration="0:0:0.02" To="#2e6da4"></ColorAnimation>
                                     <DoubleAnimation Storyboard.TargetName="container" Storyboard.TargetProperty="Opacity"
                                                      Duration="0:0:0.02" To="0.8"></DoubleAnimation>
                                 </Storyboard>
                             </VisualState>
                         </VisualStateGroup>
                     </VisualStateManager.VisualStateGroups>
                 </Border>
             </ControlTemplate>
         </Setter.Value>
     </Setter>
 </Style>

有像 Bootstrap WPF 和 Material Design WPF 这样的开源解决方案，您可以阅读和更改它们。

Answer 2

我认为它正在寻找一个名为Button 的属性和一个名为Background 的子属性。把Button.Background改成Background，你的状态应该不错：

<Style.Triggers>
    <Trigger Property="IsMouseOver" Value="True">
        <Setter Property="Background" Value="Transparent"/>
    </Trigger>
</Style.Triggers>