XAML动画

作者：孙英鹏   撰写时间：2019年6月24日

关于动画大家并不陌生，但对于代码XAML动画来讲可能就陌生了，今天就来给大家讲一下什么是XAML动画。

关于动画实际上有两种类型：
第一种：是在开始值和结束值之间以逐步增加的方式改变属性 的动画(线性插值过程)
第二种：是从一个值突然变成另一值的动画(关键帧动画)。所有关键帧动画都使用“类型名 + AnimationUsingKeyFrames” 的形式进行命名，比如StringAnimationUsingKey Frames和ObjectAnimationUsingKeyFrames。

动画是一种简单的“渐变”动画，我们为一个动画指定开始值和一个结束值，并指定由开始值到达结束值所需的时间，便可形成一个简单的动画。实现动画需要故事板和事件触发器。

故事板：Storyboard（故事板）是动画的基本单元，是控制动画的播放和暂停等操作。

事件触发器：是通过事件触发器播放BeginStoryboard故事板的动画效果。

关于它们的XAML代码如下：

 <Window x:Class="动画.dome1"
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
 xmlns:mc="http://schemas.openxmlformats.org/markupcompatibility/2006"
 xmlns:local="clr-namespace:动画"
 mc:Ignorable="d" Title="dome1" Height="300" Width="300">
 <Window.Resources>
<!--故事板-->
<Storyboard x:Key="my" x:Name="storyboard1">
<ColorAnimation Storyboard.TargetName="ellipse1"
Storyboard.TargetProperty="(Ellipse.Fill).(SolidColorBrush.Color)"
From="White" To="PeachPuff" Duration="0:0:2">
</ColorAnimation>
</Storyboard>
</Window.Resources>
<!--窗口触发器-->
    <Window.Triggers>
        <!--事件触发器-->
        <EventTrigger RoutedEvent="Window.Loaded">
            <!--执行事件-->
            <EventTrigger.Actions>
                <!--开始动画-->
                <BeginStoryboard Storyboard="{StaticResource my}"/>
            </EventTrigger.Actions>
        </EventTrigger>
    </Window.Triggers>
<Canvas>
     <Ellipse x:Name="ellipse1" Width="200" Height="200" Fill="White"
Canvas.Left="51" Canvas.Top="35" Stroke="Pink" StrokeThickness="5"/>
    </Canvas>
</Window>

首先创建一个窗口，先写故事板，在故事板里写上From（动画从From属性指定的值继续到正在进行动画处理的属性的基值或前一动画的输出值，具体取决与前一动画的配置方式）、 To（动画的输出值继续到To属性指定的值）、 Duration（动画执行的时间长度）。写好了故事板，接下来就是窗口触发器，首先写事件触发器，然后在执行事件并开始动画，写好了触发器，就开始写动画的形状，我这里的动画形状是一个圆形，然后再给里面添加颜色，就行了（自己喜欢什么就加什么），接下来就是运行一下动画的效果。

效果：