c# - Windows Phone 7 (WP7) 中的动画最简单的方法？

Question

背景:

我真的很想为我一直在制作的基于文本的小游戏演示添加一些动画，游戏本身的主要代码几乎已经存在或回旋处。

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

问题:

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

作为新手程序员和 c# 的新手，我不知道这意味着什么，也不知道它在任何实际环境中的工作情况。教程也非常模糊，程序员不解释他们的代码或代码的作用。

我想做什么:

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

示例:

当我按下一个按钮时:

• 我想要一个看起来类似于小火焰的 Gif 的动画，它会作为动画图像出现在屏幕上。

• 由于每页最多只有三/四个位置，所以我可以只使用三个单独的图像框。

我希望它能够在现有的“图像”结构中工作，这些结构可以放置在 Visual studio 所见即所得的拖放系统中。

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

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

我在用什么:

我正在使用 XAML，我根本没有使用 XNA。我只是默认使用 WP7，它随 cs 和 XAML 一起提供。

额外的粒子效果示例:

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

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

---

• 所以，基本上，用简单的英语来说 -- 制作用于 WP7 应用程序的动画的最简单、最好的方法是什么。

• 而且，如何开始制作这样的动画？

提前感谢您的帮助。

Answer 1

这很宽泛，所以我会分块来解决:

1. “粒子”效果将是一个非常复杂的 Storyboard。您链接到的视频显然在某些应用程序中使用了 XNA，这很可能就是粒子存在的地方，因为使用该技术更简单。

2. 没有任何理由在此处使用图像控件。微软不支持 GIF 格式，所以你想要的任何动画都必须手工完成。如果您只想为静态“火焰”图像设置动画，则可以使用图像控件。这是我唯一能想到的情况。

3. 现在是正题，这里是一个 Storyboard示例:

   <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，这样它就会不断循环。此动画会将火焰图像从一侧移动到另一侧，并使其淡入淡出。您可以命名 Storyboard并在代码隐藏中启动它，或使用触发器:http://msdn.microsoft.com/en-us/library/ms744905(v=vs.110).aspx

如果我能澄清任何问题，请告诉我，希望以上内容对您有所帮助!