反复按下按钮时,ColorAnimation停留在颜色上

本文关键字:ColorAnimation 停留在 颜色 按钮 | 更新日期: 2023-09-27 18:21:51

我有一个带有ColorAnimation的自定义button-style

这可以很好地工作,但当多次重复按下时,它会停留在目标颜色上。

<Style TargetType="Button" x:Key="mainButton">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}">
                    <ContentPresenter Content="{TemplateBinding ContentControl.Content}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsPressed" Value="True">
                        <Trigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <ColorAnimation 
                                    Duration="0:0:0.10" 
                                    Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)" 
                                    To="Red"
                                    AutoReverse="True"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.EnterActions>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

我该如何解决此问题?

反复按下按钮时,ColorAnimation停留在颜色上

更新

是的,如果你负担不起在Trigger.ExitActions中删除Storyboard,那么你确实必须解决From的问题,以便自己中间启动Storyboard

但是,指定一个硬编码的From并不是唯一的解决方案。可以让动画在启动时将自身重置为基础颜色。

这样做的好处是,不指定From,您就少了一件需要跟踪未来更新的事情。

<Storyboard AutoReverse="True">
  <!-- By not specifying a To or From we pretty much reset the property to un-animated state(Exactly what the hard-coded from does) -->
  <ColorAnimation Duration="0:0:0"
                  Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)" />
  <!-- This part is same as original time to kick into new Foreground as desired -->
  <ColorAnimation Duration="0:0:1.5"
                  Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)"
                  To="Red" />
</Storyboard>

您尚未在ColorAnimation上设置From属性。因此,当您在其动画中间按下按钮时,Storyboard会将当前Foreground颜色值作为其From,这是动画反转为的颜色。

现在,当你反复按下按钮时,From的颜色越来越接近红色,给人的印象是颜色粘在红色上。


更新:

这个答案只是指出了问题所在。请参阅Viv的答案以获得优雅的解决方案