动画

关键帧

关键时间可以指定为时间值、百分比或特殊值Uniform或Paced。

          <DoubleAnimationUsingKeyFrames 
            Storyboard.TargetName="TranslateTransform02" 
            Storyboard.TargetProperty="X"
            Duration="0:0:10"
            RepeatBehavior="Forever">

            
            <LinearDoubleKeyFrame Value="100" KeyTime="30%" />
            <LinearDoubleKeyFrame Value="200" KeyTime="80%" />
            <LinearDoubleKeyFrame Value="500" KeyTime="90%" />
            <LinearDoubleKeyFrame Value="600" KeyTime="100%" />
          DoubleAnimationUsingKeyFrames>

Uniform关键时间将可用时间平均除以关键帧数，以确定每个关键帧的结束时间。

<DoubleAnimationUsingKeyFrames 
            Storyboard.TargetName="TranslateTransform03" 
            Storyboard.TargetProperty="X"
            Duration="0:0:10"
            RepeatBehavior="Forever">

            
            <LinearDoubleKeyFrame Value="100" KeyTime="Uniform" />
            <LinearDoubleKeyFrame Value="200" KeyTime="Uniform" />
            <LinearDoubleKeyFrame Value="500" KeyTime="Uniform" />
            <LinearDoubleKeyFrame Value="600" KeyTime="Uniform" />
          DoubleAnimationUsingKeyFrames>

Paced关键时间根据每个关键帧的长度分配可用时间，以确定每个帧的持续时间。 这样，动画的速度或速率将保持不变。

<DoubleAnimationUsingKeyFrames 
            Storyboard.TargetName="TranslateTransform04" 
            Storyboard.TargetProperty="X"
            Duration="0:0:10"
            RepeatBehavior="Forever">

            
            <LinearDoubleKeyFrame Value="100" KeyTime="Paced" />
            <LinearDoubleKeyFrame Value="200" KeyTime="Paced" />
            <LinearDoubleKeyFrame Value="500" KeyTime="Paced" />
            <LinearDoubleKeyFrame Value="600" KeyTime="Paced" />
          DoubleAnimationUsingKeyFrames>

这个例子不够典型，应该由不同的关键帧类型组合起来才有意义

缓动函数

运行时提供的几个缓动函数之一来创建常见效果。

• BackEase：在动画开始在指示的路径中设置动画之前稍微缩回动画的运动。

• BounceEase：创建弹跳效果。

• CircleEase：创建使用圆形函数加速和/或减速的动画。

• CubicEase： 创建使用公式f（t） = t3加速和/或减速的动画。

• ElasticEase：创建类似于弹簧来回摆动的动画，直到它开始休息。

• ExponentialEase：创建使用指数公式加速和/或减速的动画。

• PowerEase： 创建使用公式f（t） = tp的公式加速和/或减速的动画Power，其中 p 等于属性。

• QuadraticEase： 创建使用公式f（t） = t2加速和/或减速的动画。

• QuarticEase： 创建使用公式f（t） = t4加速和/或减速的动画。

• QuinticEase： 创建使用公式f（t） = t5加速和/或减速的动画。

• SineEase：创建使用子项公式加速和/或减速的动画。

要将缓动函数应用于动画，请使用动画EasingFunction的属性指定要应用于动画的缓动函数。

<DoubleAnimation From="30" To="200" Duration="00:00:3" 
                         Storyboard.TargetName="myRectangle" 
                         Storyboard.TargetProperty="Height">
                            <DoubleAnimation.EasingFunction>
                                <BounceEase Bounces="2" EasingMode="EaseOut" 
                                 Bounciness="2" />
                            DoubleAnimation.EasingFunction>
                        DoubleAnimation>

属性EasingMode更改缓动函数的特性，即更改动画插值的方式。 您可以为EasingMode：

• EaseIn：插值遵循与缓动函数关联的数学公式。

• EaseOut：插值遵循 100% 插值减去与缓动函数关联的公式的输出。

• EaseInOut：插值用于EaseIn动画的上半部分和EaseOut下半场。

路径动画

WPF 提供以下路径动画类。

<MatrixAnimationUsingPath
              Storyboard.TargetName="ButtonMatrixTransform"
              Storyboard.TargetProperty="Matrix"
              DoesRotateWithTangent="True"
              Duration="0:0:5" 
              RepeatBehavior="Forever" >
                <MatrixAnimationUsingPath.PathGeometry>
                  <PathGeometry 
                    Figures="M 10,100 C 35,0 135,0 160,100 180,190 285,200 310,100" 
                    PresentationOptions:Freeze="True" />
                MatrixAnimationUsingPath.PathGeometry>
              MatrixAnimationUsingPath>

MatrixAnimationUsingPath时，可以沿路径移动对象。 如果将 的属性DoesRotateWithTangent设置为true，它还会沿路径的曲线旋转对象。

每个路径动画类都提供了PathGeometry用于指定其输入的属性。PathGeometry对象由一个或多个 PathFigure 对象组成，每个对象 PathFigure 表示不同的 "图形" 或形状。 每个 PathFigure 对象都由一个或多个 PathSegment 对象组成，每个对象表示图形或形状的连接部分。