wpf按钮背景悬停颜色

时间:2013-06-29 03:40:06

标签: wpf xaml button styles hover

我正在尝试在悬停时更改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中定义悬停状态的最小方法是什么?

2 个答案:

答案 0 :(得分:8)

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

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>

答案 1 :(得分: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的属性RenderMouseOverRenderPressed上的绑定。 ButtonChrome的设计方式优先于Background属性中的任何值。因此,遗憾的是,覆盖单击或突出显示按钮的背景颜色的唯一方法是覆盖其模板。