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

Question

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

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

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

感谢您提前回复！

BR, 佐利

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

做这样的事情：

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

Answer 1

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();
}

Answer 2

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

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>