【问题标题】:Change background color on mouseover在鼠标悬停时更改背景颜色
【发布时间】:2016-08-19 15:41:46
【问题描述】:

我已经设法制作了一个圆形边框按钮,但是当鼠标悬停时我似乎无法更改其背景颜色。不透明度会改变,但背景颜色不会改变。

<Style TargetType="Button" x:Key="FlatButtonStyle">
    <Setter Property="OverridesDefaultStyle" Value="True" />
    <Setter Property="Cursor" Value="Hand" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Name="border" BorderThickness="0" BorderBrush="Black" Background="{TemplateBinding Background}" CornerRadius="4">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                </Border>

            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="Orange"/>
            <Setter Property="Opacity" Value="0.91" />

        </Trigger>
    </Style.Triggers>
</Style>

如您所见,我不确定为什么 opacity 有效,但另一个无效。但是,我认为这与实际按钮本身存在冲突:

<Button Style="{StaticResource FlatButtonStyle}" Content="Sign In" VerticalAlignment="Top" Margin="10,267,10,0" Background="#FF3650F3" Foreground="White" Height="29" Command="{Binding SignIn}">

有没有办法覆盖它?我要做的是创建一个通用的圆形按钮模板,将背景更改为橙色。但我希望能够设置默认背景,就像我在按钮中显示的那样。

【问题讨论】:

  • 您是否尝试过使用十六进制值,而不是使用Orange 颜色名称? #FFFFA500 之类的东西?
  • @GeoffJames 是的,我有,但什么都没有。
  • 你在这里看过这个答案吗?:stackoverflow.com/a/17259993/6240567 - 我认为关键部分可能是&lt;Setter Property="OverridesDefaultStyle" Value="True" /&gt; 进入你的Style 声明

标签: wpf xaml


【解决方案1】:

试试这个

<Style TargetType="Button" x:Key="FlatButtonStyle">
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
            <Border Name="border" BorderThickness="0" BorderBrush="Black" Background="{TemplateBinding Background}" CornerRadius="4">
                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
            </Border>
<ControlTemplate.Triggers>
    <Trigger Property="IsMouseOver" Value="True">
        <Setter TargetName="border" Property="Background" Value="Orange"/>
        <Setter Property="Opacity" Value="0.91" />
    </Trigger>
</ControlTemplate.Triggers>
        </ControlTemplate>
    </Setter.Value>
</Setter>

要通过名称直接定位边框,但由于它位于 ControlTemplate 内部,因此最好将触发器移到那里。如果您像不透明度设置器一样将名称省略,则它的切割器足以知道您以按钮本身为目标,因为它是该按钮的控制模板。因此,您可以针对单个组件以及按钮。

【讨论】:

  • 我刚刚评论了几乎相同的东西 - 我认为关键部分是 &lt;Setter Property="OverridesDefaultStyle" Value="True" /&gt;?
  • @Dimitri 我添加了一些解释,我们总是使用 controltemplate 触发器,这是最简单的方法,并且始终有效。
  • @Dimitri - 所有 ControlTemplates 都有一个触发器集合,就像 Styles 一样,如果你想为某些东西制作自定义模板,放置基本功能触发器通常是个好主意(例如 MouseOver/IsPressed 等) 在模板本身中。这在样式之上,因为它是决定什么是什么并且不能被样式所做的任何事情干扰的原始控件模板(例如将 OverridesDefaultStyle 设置为 true),除非您告诉样式使用不同(或不使用)模板。
  • @Logan 明白了。感谢您的投入!
猜你喜欢
  • 2010-12-25
  • 2013-10-07
  • 1970-01-01
  • 2011-04-14
  • 1970-01-01
  • 1970-01-01
  • 2015-09-29
  • 1970-01-01
相关资源
最近更新 更多