首页 / 软件开发 / .NET编程技术 / 《Programming WPF》翻译 第8章 4.关键帧动画

《Programming WPF》翻译 第8章 4.关键帧动画2011-09-16 博客园 包建强到目前为止，我们只看到简单的点到点的动画。我们使用了To和From属性或者By属性来设计动画—— 相对于当前的属性值。这很适合简单的动画，但是我们可以构造序列来创建更复杂的动画，这可能是非常 麻烦的。幸运的是，这是没有必要的。WPF提供了动画对象，允许我们详细指出一系列时间和值。

在影视中传统的动画中，这是普通的开始——通过绘制最重要的动画步骤。这些关键帧定义了场景的 基本流程，捕获了它的最重要的点。只要一旦这些关键帧是满意的，是保留的帧绘图。这些关键帧之间的 图像并不要求非常创造性的输入，它们只是简单的打算添加进去，从一个关键帧到另一个。WPF优化了同 样的概念。你可以考虑简单的From和To方法——等价于提供两个关键帧，一个“before”帧和一个 “after”帧——WPF会为你添加这两个帧。关键帧动画简单的扩展了多个帧的概念。

作为最简单的动画类型，关键帧仍然一次性为属性设定目标。因此它们并不与传统动画中关键帧一样 ，每一帧组成了整个的绘图。你不能提供两个绘图并告诉WPF从一个变换到另一个。

关键帧动画类型使用了命名装换TypeAnimationUsingKeyFrames。示例8-24显示了一个简单的动画：一 个弹起的矩形，使用到了DoubleAnimationUsingKeyFrames。

示例8-24

<Window Text="Key Frames" Width="850" Height="300"
xmlns="http://schemas.microsoft.com/winfx/avalon/2005"
xmlns:x="http://schemas.microsoft.com/winfx/xaml/2005">


<Window.Storyboards>
<SetterTimeline TargetName="rect" Path="（Canvas.Left）"
RepeatBehavior="Forever" AutoReverse="True">
<DoubleAnimation From="0" To="800" Duration="0:0:10" />
</SetterTimeline>

<SetterTimeline TargetName="rect" Path="（Canvas.Top）">
<DoubleAnimationUsingKeyFrames Duration="0:0:2"
RepeatBehavior="Forever">
<DoubleAnimationUsingKeyFrames.KeyFrames>
<LinearDoubleKeyFrame Value="0" KeyTime="0:0:0" />
<LinearDoubleKeyFrame Value="50" KeyTime="0:0:0.5" />
<LinearDoubleKeyFrame Value="200" KeyTime="0:0:1" />
<LinearDoubleKeyFrame Value="50" KeyTime="0:0:1.5" />
<LinearDoubleKeyFrame Value="0" KeyTime="0:0:2" />
</DoubleAnimationUsingKeyFrames.KeyFrames>
</DoubleAnimationUsingKeyFrames>
</SetterTimeline>
</Window.Storyboards>

<Canvas>
<Rectangle x:Name="rect" Fill="Red" Width="20" Height="20" />
</Canvas>
</Window>