wpf按钮背景悬停颜色

Posted 2023-02-22

【中文标题】wpf按钮背景悬停颜色

【英文标题】：wpf button background hover color

【发布时间】：2013-06-26 22:04:48

【问题描述】：

我正在尝试在悬停时更改 xaml 中按钮样式的背景颜色 这是我目前的方法，但它不起作用。正在使用默认的悬停颜色

<Style x:Key="AtStyle" TargetType="Button">
        <Setter Property="Background">
            <Setter.Value>
                <SolidColorBrush Color="StaticResource AtBlue" />
            </Setter.Value>
        </Setter>
        <Setter Property="Foreground" Value="White" />
        <Setter Property="Padding" Value="12,6" />
        <Setter Property="BorderThickness" Value="0" />
        <Setter Property="FontSize" Value="18.667" />
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background">
                    <Setter.Value>
                        <SolidColorBrush Color="Red" />
                    </Setter.Value>
                </Setter>
            </Trigger>
        </Style.Triggers>
    </Style>

我看到其他解决方案说您需要覆盖 Control 模板来实现这一点，但这些解决方案还需要您定义边框和内容，这似乎没有必要。在 Xaml 中定义悬停状态的最小方法是什么？

【参考方案1】：

我根据您的要求创建了基于简单样式的按钮，

XAML

<Style  TargetType="Button">
  <Setter Property="Background"
          Value="Blue" />
  <Setter Property="HorizontalAlignment"
          Value="Center" />
  <Setter Property="VerticalAlignment"
          Value="Center" />
  <Setter Property="Foreground"
          Value="White" />
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="x:Type Button">
        <Border x:Name="bg"
                Background="TemplateBinding Background"
                BorderThickness="2"
                BorderBrush="White">
          <ContentPresenter HorizontalAlignment="TemplateBinding HorizontalAlignment"
                            VerticalAlignment="TemplateBinding VerticalAlignment" />
        </Border>
        <ControlTemplate.Triggers>
          <Trigger Property="IsMouseOver"
                   Value="True">
            <Setter Property="Background"
                    Value="Red"
                    TargetName="bg" />
          </Trigger>
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

【讨论】：

这种风格太简单了。它破坏了访问密钥，甚至不支持禁用状态。这也是错误的，因为ContentPresenter 上的对齐属性应该使用内容对齐属性。

@Athari：感谢您的建议，是的，这很简单。他们需要包括禁用和键盘焦点状态的触发器。

【参考方案2】：

我们来看一下 Aero 主题默认按钮样式的模板：

<ControlTemplate TargetType="x:Type ButtonBase">
    <theme:ButtonChrome Name="Chrome"
            Background="TemplateBinding Background"
            BorderBrush="TemplateBinding BorderBrush"
            RenderDefaulted="TemplateBinding Button.IsDefaulted"
            RenderMouseOver="TemplateBinding IsMouseOver"
            RenderPressed="TemplateBinding IsPressed"
            SnapsToDevicePixels="True">
        <ContentPresenter
                Margin="TemplateBinding Padding"
                SnapsToDevicePixels="TemplateBinding SnapsToDevicePixels"
                VerticalAlignment="TemplateBinding VerticalContentAlignment"
                HorizontalAlignment="TemplateBinding HorizontalContentAlignment"
                RecognizesAccessKey="True"/>
    </theme:ButtonChrome>
    <ControlTemplate.Triggers>
        <Trigger Property="IsKeyboardFocused" Value="True">
            <Setter TargetName="Chrome" Property="RenderDefaulted" Value="True"/>
        </Trigger>
        <Trigger Property="ToggleButton.IsChecked" Value="True">
            <Setter TargetName="Chrome" Property="RenderPressed" Value="True"/>
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter Property="Foreground" Value="#ADADAD"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

如您所见，鼠标悬停和按下的颜色被定义为ButtonChrome 的属性RenderMouseOver 和RenderPressed 上的绑定。 ButtonChrome 的设计方式，它们优先于 Background 属性中的任何值。因此，不幸的是，覆盖单击或突出显示按钮的背景颜色的唯一方法是覆盖其模板。

【讨论】：

这个例子不起作用......为什么你认为这是一个比另一个更好的答案？那个正在工作......

@Bondye 这个答案不应该“起作用”，它应该回答“为什么”这个问题并给出如何完全解决问题的指导。接受的答案“有效”，但在数量非常有限的情况下，如果需要更复杂的东西，则无济于事。更详细的分析在我对另一个问题的评论中。 TL;DR：不要只是复制粘贴；试着去理解并自己去做。