0

我正在尝试通过使用UWP Community toolkit中的动画在我的 uwp 应用程序中的 UI 元素上获得晃动(或抖动效果) 。如果我在上面放一个旋转动画,它会像预期的那样完美。但我实际上是在尝试将它们链接起来,然后将它们放在一个事件中的循环中,这样 ui 元素就会像在晃动一样循环。

因此,为此目的,我正在尝试以下代码。

var parent = panel?.Parent as UIElement;
if (parent != null)
{
    while (true)
    {
        var animation = new RotationAnimation() { To = 0.3, Duration = TimeSpan.FromMilliseconds(100) };
        animation.StartAnimation(panel);

        var animation2 = new RotationAnimation() { From = 0.3, To = 0, Duration = TimeSpan.FromMilliseconds(100) };
        animation2.StartAnimation(parent);

        var animation3 = new RotationAnimation() { To = -0.3, Duration = TimeSpan.FromMilliseconds(100) };
        animation3.StartAnimation(panel);

        var animation4 = new RotationAnimation() { From = -0.3, To = 0, Duration = TimeSpan.FromMilliseconds(100) };
        animation4.StartAnimation(parent);
    }
}

正如你所看到的,我从一些逻辑中获取了我的 UI 元素,然后我试图将4 个旋转动画1 一个接一个地链接起来。

  1. 顺时针旋转一点
  2. 恢复正常状态。
  3. 逆时针旋转一点
  4. 恢复正常状态。

这应该会产生我想要的抖动效果,但是即使我尝试在没有 while循环的情况下执行此操作,我的应用程序实际上也会挂起(并且我没有遇到任何异常) 。我试图首先创建它,然后我的目标是使其在函数中异步,以便我可以在元素上调用它,然后从另一个事件或方法停止动画。

我有一种感觉,也许这不是从UWP 社区工具包链接这些动画的正确方法,这就是 UI 冻结的原因,还有更好的方法吗?

我也知道社区工具包也提供了类似panel.Rotate()的扩展方法,但我不想使用它们,因为我必须提供面板的centerXcenterY,而且我正在使用比例在其他一些场景中,动画已经在相同的对象上,所以我不确定如何提供 UI 元素的 centerX 和 centerY。

我也在那个特定的 ui 元素上使用extensions:VisualEx.NormalizedCenterPoint="0.5,0.5,0",这就是为什么我对提供中心点有点困惑,因此想使用这个不需要任何的RotationAnimation类中心点并自动将中心点检测为元素的中心,这可能是因为我设置了那个 xaml 属性。

4

1 回答 1

1

这里的问题是StartAnimation不等待动画完成。当您运行代码时,它实际上会尝试同时运行所有动画。当你在一个while (true)块中执行时,情况会变得更糟,因为这将无限重复该过程,因此它可能会尝试同时启动数百个动画。

作为一种快速修复,您可以await Task.Delay( 100 )在各个阶段之间添加一个调用,以确保 UI 等待动画完成。但是这个解决方案不是很好,它依赖于Task.Delay动画在 100 毫秒后不会 100% 可靠地运行。

在上一个动画的情况下运行下一个动画的更好解决方案Completed

animation.Completed += YourHandler;

然而,我们为什么要重新发明轮子?我们可以使用AnimationSet工具包本身提供的!

AnimationSet

该类AnimationSet允许您创建复杂的动画并将它们一一链接。为此,您可以使用Then等待上一个动画完成后再开始下一个动画的方法。请参阅源代码

var animationSet = panel.Rotate( 0.3 )
         .Then()
         .Rotate( -0.3 )
         .Then()
         .Rotate( 0.3 )
         .Then()
         .Rotate( -0.3 );
于 2018-02-14T14:25:19.867 回答