Question

我有一个Button，我想要一个白色Background的橙色Foreground。当我将鼠标悬停在Button上时，我希望它显示在DarkOrange中。这是我目前正在使用的Style。

<Style TargetType="{x:Type Button}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>                      
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="Background" Value="DarkOrange"/>
        </Trigger>
    </Style.Triggers>
</Style>

如果我不修改我Background的原始Button颜色，这种风格可以正常工作。例如;

<Button Grid.Row="2" Content="SIGN IN" />

没有问题。但是，当我想更改Background的默认Button时，即

<Button Grid.Row="2" Content="SIGN IN" Background="Orange"/>

风格不起作用。我认为这是因为我现在正在覆盖Background试图更改的IsMouseOver属性。

有没有办法可以同时实现修改后的默认Background和IsMouseOver效果？我也试过设置<Border Background="Orange">，但仍然没有效果。

Answer 1

您只需向setter添加Style，而不是向Background添加Button媒体资源。像这样：

<Style TargetType="{x:Type Button}">
   <Setter Property="Background" Value="Orange"/>
   <Setter Property="Template">
       ...
   </Setter>
   <Style.Triggers>
       ... 
  </Style.Triggers>
</Style>

Here是另一个如何使用它的例子。

Answer 2

  <Style TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate x:Name="Border" TargetType="{x:Type Button}">
                    <Border x:Name="Border" Background="{TemplateBinding Background}">
                        <ContentPresenter x:Name="CP" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="CP" Property="TextBlock.Foreground" Value="White"/>
                            <Setter TargetName="Border" Property="Background" Value="DarkOrange"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

这可以正常使用

<Button Grid.Row="2" Content="SIGN IN" Background="Orange"/>

自定义样式按钮有修改过的背景

2 个答案: