WPF中编写动画
开发工具与关键技术：Visual Studio 2015、WPF
作者：黄元进
撰写时间：2019年5月5日
在WPF中我们采用Storyboard（故事板）的方式来编写动画，又用到了Animation（“渐变”动画），我们指定长方形的宽度由100变化到200，所需时间为1秒，就可以实现动画效果，代码里我们定义了一个DoubleAnimation，并指定了它的开始值和结束值以及它由开始值到达结束值所需的时间。用XAML代码实现：
<Window x:Class="XAML高级教程.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:XAML高级教程"
Title="MainWindow" Height="350"Width="525">
<!--渐变动画-->
<StackPanel Margin="20">
<Rectangle Name="MyRectangle"Width="100" Height="100">
<Rectangle.Fill>
<SolidColorBrush x:Name="MySolidColorBrush"Color="Blue"/>
</Rectangle.Fill>
<Rectangle.Triggers>
<EventTrigger RoutedEvent="Page.Loaded">
<BeginStoryboard>
<Storyboard RepeatBehavior="Forever"AutoReverse="True">
<DoubleAnimation
Storyboard.TargetName="MyRectangle"
Storyboard.TargetProperty="Width"
From="100" To="500"Duration="0:0:1"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Rectangle.Triggers>
</Rectangle>
</StackPanel>
注意到，这里我们使用的是DoubleAnimation，因为我们所要变化的是数值。那么如果我们要变化颜色是不是就用ColorAnimation了呢，对，其实出了这些之外还有PointAnimation等等，并且你可以实现IAnimatable接口来实现自定义版本的Animation。关于这些你可以参见System.Windows.MediaAniamtion名字空间.
但值得注意的是并非每个属性都能够使用Animation，它必须满足以下条件：
1,它必须是Dependency Property
2,它所在类必须继承于DependencyObject,必须实现了IAnimatable接口.
3,必须有类型一致的Animation Type（即Color类型使用ColorAniamtion，Point类型使用PointAnimation等）
一个简单的Animation定义了一个简单的动画，很容易想到的是，如果若干个Animation同时作用于一个对象，那么这个对象不就可以表现复杂的动画了吗，对，这就是Storyboard
Storyboard可以看做是Animation的容器，它包含了若干的简单动画来完成一个复杂动画。
参考以下代码：
<Window x:Class="XAML高级教程.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:XAML高级教程"
Title="MainWindow" Height="350"Width="525">
<!--变化矩形的颜色-->
<StackPanel Margin="20">
<Rectangle Name="MyRectangle"
Width="100" Height="100">
<Rectangle.Fill>
<SolidColorBrush x:Name="MySolidColorBrush"Color="Blue" />
</Rectangle.Fill>
<Rectangle.Triggers>
<EventTrigger RoutedEvent="Page.Loaded">
<BeginStoryboard>
<StoryboardRepeatBehavior="Forever" AutoReverse="True">
<DoubleAnimation
Storyboard.TargetName="MyRectangle"
Storyboard.TargetProperty="Width"
From="100" To="700"Duration="0:0:0.1" />
<ColorAnimation
Storyboard.TargetName="MySolidColorBrush"
Storyboard.TargetProperty="Color"
From="YellowGreen" To="NavajoWhite"Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Rectangle.Triggers>
</Rectangle>
</StackPanel>
这里我们的Storyboard定义了DoubleAnimation来变化矩形的宽度，并定义了ColorAnimation来变化矩形的颜色。