如何在 Windows 应用商店应用程序中为按钮位置（边距）设置动画？答案

【问题标题】：How to animate Button position (Margin) in Windows Store app?如何在 Windows 应用商店应用程序中为按钮位置（边距）设置动画？
【发布时间】：2013-06-13 15:26:28
【问题描述】：

我正在创建一个 Windows 8 应用程序，我需要为按钮的位置设置动画。这些按钮是动态创建的，因此 XAML 不是一个选项。按钮的位置是根据厚度类型的 Margin 属性计算的。我发现 ThicknessAnimation 确实存在于 WPF 中，但不存在于 Windows 应用商店应用程序中。如何为动态创建的按钮位置设置动画？由于许多原因，我也不能使用 RenderTransform，因为我有太多的事件和属性，具体取决于对象的实际位置（边距）。我发现了这个问题Windows 8 store app c# animating margin，但不幸的是它已关闭。我一般都知道动画（创建故事板、添加动画、添加目标对象和属性、开始故事板），但我不知道如何将其应用于厚度属性。

谢谢，

可以。

【问题讨论】：

我在动画方面做得很少，所以请接受这个评论。这个answer 似乎使用情节提要为 Windows Phone 7 制作了厚度动画。显然 WP7 也不存在厚度动画。它在 xaml 中，但可以为您提供有关如何在代码中执行此操作的线索。
为 Margin 设置动画实际上并不是一个好主意，因为这需要重新排列所有其他元素。为什么你不想使用msdn.microsoft.com/en-us/library/windows/apps/…？
@outcoldman 有很多值取决于 margin 属性的值。变换只是视觉上的（据我所知），我需要按钮位置的实际值进行许多计算，而变换会使它变得非常复杂。（所有控件也在一个视图框中，它还可以缩放控件，变换只是把所有东西都弄乱了）。无论如何，我最终手动使用调度程序计时器为边距属性设置动画。

标签： c# animation windows-runtime windows-store-apps

【解决方案1】：

您可以处理CompositionTarget.Rendering 事件，尽管您必须自己管理所有定位数学，这在有很多物体的情况下可能会很困难 - 这只是一个示例，看起来有点奇怪，但确实有效：

public MainPage()
{
    this.InitializeComponent();
    CompositionTarget.Rendering += OnCompositionTargetRendering;
}

private void OnCompositionTargetRendering(object sender, object e)
{
    RenderingEventArgs args = e as RenderingEventArgs;
    double t = (args.RenderingTime.TotalMilliseconds) % 20;
    button1.Margin = new Thickness(t);
}

【讨论】：

我也可以以类似的方式使用计时器制作动画。但我正试图找到一种更方便的方法。我不明白的是，真的没有一个动画 ui 元素是 Windows 商店应用程序吗？似乎没有人真正做到这一点。