Xamarin Forms 等待动画或事件完成答案

【问题标题】：Xamarin Forms wait for animation or event to finishXamarin Forms 等待动画或事件完成
【发布时间】：2017-12-14 20:59:10
【问题描述】：

所以我试图让我的按钮在另一个动作发生之前执行它的动画。但是我的设置方式有点奇怪。

我有一个名为 AnimatedButton 的子类按钮，它添加了一个 Click += AnimatedButton_Clicked 处理程序来执行动画，如下所示：

    using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;

namespace TransactionApp_2.Views.UITools.Buttons
{
    class AnimatedButton : Button
    {
        /// <summary>
        /// Generic Animated Button Subclass that allows for:
        /// Button indexing,
        /// Simple sleek animations,
        /// Sets initial properties and parameters,
        /// allows easy background images
        /// </summary>

        public int ButtonIndex { get; set; }
        public AnimatedButton(string buttonText, ImageSource backgroundImage = null, int buttonIndex = 0)
        {
            ButtonIndex = buttonIndex;
            Text = buttonText;
            FontSize = Device.GetNamedSize(NamedSize.Large, typeof(Label));
            Opacity = 0.95;
            Margin = new Thickness(8,0,8,0);

            Clicked += AnimatedButton_Clicked;

            if (backgroundImage != null)
            {
                //Set Background Image
            }

        }
        private async void AnimatedButton_Clicked(object sender, EventArgs e)
        {

            //Obsolete version of OnPlatform
#pragma warning disable CS0618 // Type or member is obsolete
            var platformSpecific = Device.OnPlatform<uint>(50, 50, 25); //Whats the new version of this??
#pragma warning restore CS0618 // Type or member is obsolete

            //Simple Animations
            await this.ScaleTo(0.85, platformSpecific, Easing.SinIn);


     await this.FadeTo(0.8, platformSpecific, Easing.SinOut);
        await this.FadeTo(0.95, platformSpecific, Easing.SinIn);
        await this.ScaleTo(1, platformSpecific, Easing.SinOut);
    }
}

}

在我的 UI 后端代码中，我还添加了一个刷新 UI 网格的新单击事件，如下所示：

            for (int i = 0; i < count; i++)
        {

            grid.RowDefinitions.Add(rowCollection[i]);
            AnimatedButton button = new AnimatedButton(menuOptions.ItemDataList[i].TitleText) { ButtonIndex = i+1};
            button.Clicked += (s, e) =>
            {
                        RefreshGrid(button.ButtonIndex);
            };
            grid.Children.Add(button, 0, i + 1);
        }

显然这两个事件都是在按下按钮时同时执行的，网格在动画完成之前刷新。使用这种类型的设置如何让 RefreshGrid() 调用等到子类中的动画完成？我一直在尝试使用线程来处理这个问题，但没有运气。

认为也许有一种方法可以在调用 RefreshGrid() 之前等待事件或动画完成，或者更好地使用线程。

谢谢！

【问题讨论】：

你不能有一个布尔值performingAnimation，默认设置为false，然后在你的AnimatedButton_Clicked方法中设置为true，一旦完成（即有一个事件）将其设置为false，然后表单上的 Click 处理程序会检查这是否仍在继续？ IE。 do until performingAnimation = false?还需要确保您不会在那里遇到无限循环。只是一个想法。
我试过了，但它根本不起作用。这也是我的第一个想法。我今晚再试一次

标签： c# xamarin xamarin.forms

【解决方案1】：

这看起来像是一种变通方法，但您可以公开在点击事件的动画完成后引发的另一个事件，并让后端订阅它。

大概是这个样子。（免责声明：此代码未经测试。）

动画按钮：

public event EventHandler ClickedAnimationCompleted = delegate { };

private async void AnimatedButton_Clicked(object sender, EventArgs e) {

    //...other code removed for brevity

    //Simple Animations
    await this.ScaleTo(0.85, platformSpecific, Easing.SinIn);

    await this.FadeTo(0.8, platformSpecific, Easing.SinOut);
    await this.FadeTo(0.95, platformSpecific, Easing.SinIn);
    await this.ScaleTo(1, platformSpecific, Easing.SinOut);

    ClickedAnimationCompleted(this, EventArgs.Empty);   
}

后端：

for (int i = 0; i < count; i++) {
    grid.RowDefinitions.Add(rowCollection[i]);
    AnimatedButton button = new AnimatedButton(menuOptions.ItemDataList[i].TitleText) { ButtonIndex = i+1};
    button.ClickedAnimationCompleted += (s, e) => {
        RefreshGrid(button.ButtonIndex);
    };
    grid.Children.Add(button, 0, i + 1);
}

【讨论】：

【解决方案2】：

添加与动画一样多的延迟。

await grid1.TranslateTo(-100, 0, 300);
await Task.Delay(300);

【讨论】：

最好使用TaskCompletionSource 并将其结果设置在完成的回调中。