Question

我现在正在使用Button样式，我已经包含了一个控件模板和样式触发器。现在我想让鼠标进入按钮时背景画笔淡化为某种颜色。但是颜色动画不适用于画笔。从昨天开始我就坚持了下来。以下是我在按钮样式中所做的事情：

<Converters:MathConverter x:Key="MathConverter" />
<Converters:ColorToBrushConverter x:Key="ColorToBrushConverter" />
<Style TargetType="Button">
    <Setter Property="FontSize"
            Value="{Binding FontSizeButton}" />
    <Setter Property="Margin"
            Value="{Binding FontSizeBase, Converter={StaticResource MathConverter}, ConverterParameter=@VALUE/3}" />
    <Setter Property="Padding"
            Value="{Binding FontSizeButton, Converter={StaticResource MathConverter}, ConverterParameter=@VALUE/3}" />
    <Setter Property="MinWidth"
            Value="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" />
    <Setter Property="Width"
            Value="NaN" />
    <Setter Property="Background"
            Value="{Binding BrushBackButton}" />
    <Setter Property="BorderBrush"
            Value="{Binding BrushBorder}" />
    <Setter Property="BorderThickness"
            Value="{Binding BorderThicknessBase}" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border x:Name="MainBorder" BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        Background="{TemplateBinding Background}">
                    <ContentPresenter x:Name="Content"
                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                      TextElement.Foreground="{TemplateBinding Foreground}" />
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <!--
        <Trigger Property="IsMouseOver"
                 Value="True">
            <Setter Property="Background"
                    Value="{Binding BrushBackButtonOver}" />
        </Trigger>
        -->
        <EventTrigger RoutedEvent="MouseEnter">
            <BeginStoryboard>
                <Storyboard TargetProperty="Background">
                    <ColorAnimation To="Blue" Duration="10"/>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Style.Triggers>
</Style>

Answer 1

您应该使用VisualStateManager来解决此类问题。

它可能会引导你做类似的事情：

   <Style TargetType="{x:Type Button}">
     <Setter Property="Template">
       <Setter.Value>
         <ControlTemplate TargetType="{x:Type Button}">
           <Border x:Name ="Border" Background="LightBlue">
             <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                   <VisualStateGroup.Transitions>
                     <VisualTransition GeneratedDuration="0:0:0.2"/>
                   </VisualStateGroup.Transitions>
                   <VisualState x:Name="Normal"/>
                   <VisualState x:Name="Pressed">
                     <Storyboard>
                       <ColorAnimation 
                    Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)" 
                    To="Red"/>
                     </Storyboard>
                   </VisualState>
                   <VisualState x:Name="MouseOver">
                      <Storyboard>
                         <ColorAnimation
                   Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)" 
                   To="Blue"/>
                      </Storyboard>
                   </VisualState>
                </VisualStateGroup>
             </VisualStateManager.VisualStateGroups>
             <ContentPresenter Content="{TemplateBinding Content}"/>
         </Border>
[...]

[编辑] 关于您的具体问题，您应该将触发器放在ControlTemplate的触发器中。

 <ControlTemplate TargetType="{x:Type Button}">
 [...]
  <ControlTemplate.Triggers>
    <EventTrigger RoutedEvent="MouseEnter">
        <BeginStoryboard>
           <Storyboard  TargetName="Border" TargetProperty="(Background).(SolidColorBrush.Color)">
               <ColorAnimation To="Blue" Duration="0:0:0.2"/>
           </Storyboard>
        </BeginStoryboard>
      </EventTrigger>
   </ControlTemplate.Triggers>

WPF，在按钮样式的Style.Triggers中创建画笔动画

1 个答案: