Question

我有一个带有coloranimation的按钮和一个点击事件。 coloranimation在1秒内将按钮的背景从灰色变为橙色，然后反转。在点击事件中，我加载了很多东西（大约需要4-5秒）。

我的问题是，当我点击按钮时动画开始，但在几毫秒（点击事件开始）后立即停止，并且在点击事件结束后，它也完成了动画。我希望首先完成动画，然后执行点击事件。

我google了很多，发现动画完成了事件并且它正在工作，但是有可能以某种方式为此制作一个基本的解决方案，我可以用于我的程序中的所有按钮吗？

感谢您提前回复！

BR，佐利

编辑：---------------------------------------------

做这样的事情：

PreviewMouseDown()
{
    AnimateTheButton();
    //Wait for the animation to be finished
}

Answer 1

好的，如果你想要漂亮且可重复使用的解决方案，请查看我为你写的内容。只需将此类添加到您的解决方案中即可。

public sealed class AnimatedButton : Button
{
    private bool _isAnimationRunning;

    public static readonly DependencyProperty AnimationProperty =
        DependencyProperty.Register("Animation", typeof(Storyboard), typeof(AnimatedButton));

    public Storyboard Animation
    {
        get { return (Storyboard) GetValue(AnimationProperty); }
        set { SetValue(AnimationProperty, value); }
    }

    protected override void OnPreviewMouseDown(System.Windows.Input.MouseButtonEventArgs e)
    {
        _isAnimationRunning = true;
        if (Animation != null)
        {
            var clonedAnimation = Animation.Clone(); // Else we cannot subscribe Completed event
            clonedAnimation.Completed += OnAnimationComplete;
            clonedAnimation.Begin(this);
        }
        base.OnPreviewMouseDown(e);
    }

    protected override void OnClick()
    {
        if (Animation != null && _isAnimationRunning)
        {
            return;
        }
        base.OnClick();
    }

    private void OnAnimationComplete(object sender, EventArgs eventArgs)
    {
        _isAnimationRunning = false;
        OnClick();
    }
}

用法。只需将其插入应用程序资源：

<Application.Resources>
    <Style x:Key="{x:Type controls:AnimatedButton}" TargetType="{x:Type TestWpf:AnimatedButton}">
        <Setter Property="Animation">
            <Setter.Value>
                <Storyboard Duration="0:0:2">
                    <DoubleAnimation From="0.2" To="1" Storyboard.TargetProperty="Opacity">
                    </DoubleAnimation>
                </Storyboard>
            </Setter.Value>
        </Setter>
    </Style>
</Application.Resources>

然后你可以像通常的按钮一样使用它：

<local:AnimatedButton Click="OnAnimatedButtonClicked">
    Super cool button
</local:AnimatedButton>

Answer 2

https://stackoverflow.com/a/11955887/12258498

我不止一次收到OnClick事件。我修复了两种方法：

protected override void OnClick()
{
    if (Animation != null && _isAnimationRunning)
    {
        return;
    }
  //  base.OnClick(); 
}

private void OnAnimationComplete(object sender, EventArgs eventArgs)
{
    _isAnimationRunning = false;
    // OnClick();
    base.OnClick();
}

执行点击之前WPF完成按钮动画

2 个答案: