Windows Phone 7 (WP7) 中的动画最简单的方法？答案

【问题标题】：Animation In Windows Phone 7 (WP7) Simpliest Method?Windows Phone 7 (WP7) 中的动画最简单的方法？
【发布时间】：2014-04-28 21:44:48
【问题描述】：

背景：

我真的很想在我一直在制作的基于文本的小型游戏演示中添加一些动画，游戏本身的主要代码几乎就在那里或环形交叉路口。

到目前为止，我对自己的进步感到满意 - 但我很想为它注入一些活力，并通过动画让它比现在更好。

问题：

我在寻求帮助之前找到的方法都涉及“Silverlight”或“故事板”

作为一个新手程序员和 c# 的新手，我不知道这意味着什么，或者到目前为止已经看到它在任何实际环境中工作。教程也很模糊，程序员没有解释他们的代码或它的作用。

我想做的事：

我希望当用户按下按钮时会开始播放小动画，并且在某些地方可能会持续播放单独的动画，例如横幅动画。

示例：

当我按下按钮时：

我想要一个看起来类似于小火焰 Gif 的动画，它会以动画图像的形式出现在屏幕上。
由于每页最多只有三个/四个位置，我可以只使用三个单独的图像框。

我希望它可以在现有的“图像”结构中工作，这些结构可以放置在 Visual Studios WYSIWYG 拖放系统中。

这是我想要实现的示例，类似于视频左右两侧的火锅上方的火焰：

https://www.youtube.com/watch?v=kKmW9gNENJA

我正在使用什么：

我正在使用 XAML，我根本没有使用 XNA。我只是使用 WP7 作为默认值，它带有 cs 和 XAML。

EXTRA 粒子效果示例：

虽然这不相关，但下面视频中的“粒子效果”也是我最终想要实现的。

https://www.youtube.com/watch?v=7w3dJIGSzPo&list=PLE4TZmqEfiRIy-4vyGwfNhOAuI8YwXF7T&index=48

所以，基本上，用简单的英语 - 制作用于 WP7 应用程序的动画的最简单、最好的方法是什么。
那么，如何开始制作这样的动画？

提前感谢您的帮助。

【问题讨论】：

Storyboard 确实是在 WPF/Silverlight 中制作动画的正确方法。但是，您使用的是 XNA 或 WP7 XAML（类似于 WPF，但不完全相同）。你用的是哪一个？您提供了一些很好的信息，但是一点点代码和了解您使用的技术会很棒。
嘿布拉德利。我正在使用 XAML。 XNA 是与游戏相关的东西，我实际上是有意避免使用的。
好的，粒子效果并不容易，但我很乐意为故事板提供帮助。您查看过msdn.microsoft.com/en-us/library/… 的文档吗？你能把问题缩小一点吗？我会尝试整理一个基本的故事板解释作为答案，但任何缩小范围都会非常有帮助。
我有，但我仍然有问题。
我会从实际工作的视觉示例中学到更多。我不是一个很有经验的程序员。

标签： c# windows-phone-7 animation

【解决方案1】：

这很宽泛，所以我将分块解决：

“粒子”效果将是一个非常复杂的故事板。您链接到的视频显然在应用程序的某些部分使用 XNA，这可能是粒子所在的位置，因为使用该技术更简单。
这里没有任何真正的理由使用图像控件。 Microsoft 不支持 GIF 格式，因此您想要的任何动画都必须手动完成。如果您只想为静态“火焰”图像设置动画，则可以使用图像控件。这是我能想到的唯一一种情况。

现在是肉，这里是一个示例故事板：

<Storyboard>
   <DoubleAnimation Storyboard.TargetName="Flame" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:1" RepeatBehavior="Forever" />
   <DoubleAnimationUsingKeyFrames Storyboard.TargetName="FlameTranslateTransform" Storyboard.TargetProperty="X" RepeatBehavior="Forever">
      <LinearDoubleKeyFrame KeyTime="0:0:0" Value="-100"/>
      <LinearDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
      <LinearDoubleKeyFrame KeyTime="0:0:1" Value="1"/>
   </DoubleAnimationUsingKeyFrames> 
</Storyboard>

假设有一个控件声明如下：

<Image x:Name="Flame">
   <Image.RenderTransform x:Name="FlameTranslateTransform">
      <TranslateTransform X="0" Y="0"/>
   </Image.RenderTransform>
</Image>

为了解释，您必须从 Storyboard 元素开始。然后这个元素包含动画。动画使用Storyboard.TargetName 设置它们将作用的元素的名称，并使用Storyboard.TargetProperty 设置要修改的属性的名称。

我给出了一个标准动画的例子（使用From 和To，它只是在指定的Duration 上在两者之间进行线性插值）和一个关键帧动画（在指定时间，我再次使用线性插值）。

我还将RepeatBehavior 设置为Forever，所以它会不断循环。此动画将火焰图像从一侧移动到另一侧，并使其淡入淡出。您可以命名故事板并在代码隐藏中启动它，或使用触发器：http://msdn.microsoft.com/en-us/library/ms744905(v=vs.110).aspx

如果我能澄清任何事情，请告诉我，希望以上内容有所帮助！

【讨论】：

该情节提要在 XAML 中是否有效？抱歉，我只是迷路了。将更新主要评论。
提供的代码是 XAML :)。所以我认为你的问题的答案是肯定的。有没有让你感到困惑的特定作品？
我不确定 XAML 的实际工作原理，我的 XAML 似乎不适用于您提供的代码。
“不起作用”是什么意思？您的故事板需要在触发器或资源中。我没有看到你的任何代码，我的代码只是试图解释故事板。如果没有更多信息，我不确定如何提供帮助
我的意思是，我真的很想了解如何将动画整合到 C# 中。我对所有东西都很陌生，Storyboards，XAML，甚至环境本身。如果有人能用简单的英语向我解释这个过程，那就太好了。我非常感谢您的代码，但如果不完全了解它的作用、从何处获取信息等，我真的无法理解如何设置故事板等系统。