在动画中,可以使用移动的元素、颜色变化、变换等制作平滑的变换效果。WPF使动画的制作非常简单。还可以连续改变任意依赖属性的值。不同的动画类可以根据其类型,连续改变不同属性的值。
动画的主要元素如下:
添加一个当Loaded完成后让椭圆的宽度自动变化的XAML代码:
<Window x:Class="WpfAppLearn1.TimeLine" 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/markup-compatibility/2006" xmlns:local="clr-namespace:WpfAppLearn1" mc:Ignorable="d" Title="TimeLine" Height="450" Width="439"> <Canvas> <Ellipse x:Name="ellipse" Height="100" Width="100" Canvas.Left="45" Canvas.Top="180" Fill="Red"> <Ellipse.Triggers> <EventTrigger RoutedEvent="Ellipse.Loaded"> <EventTrigger.Actions> <BeginStoryboard> <Storyboard> <DoubleAnimation Storyboard.TargetProperty="Width" RepeatBehavior="1x" Duration="0:0:6" AutoReverse="True" FillBehavior="Stop" From="100" To="300" Completed="DoubleAnimation_Completed"/> </Storyboard> </BeginStoryboard> </EventTrigger.Actions> </EventTrigger> </Ellipse.Triggers> </Ellipse> </Canvas> </Window>
Timeline属性 | 说明 |
AutoReverse | 指定连续改变的值是否在动画结束后返回初始值(默认为False) |
SpeedRatio | 可以改变动画的移动速度。在这个属性中,可以定义父子元素的相对关系。(默认值为1) |
BeginTime | 指定从触发器事件激活到动画开始移动之间的时间长度,即延时启动动画。 (默认值为0,值可以为null表示永不播放) 这和SpeedRatio属性有关:若将SpeedRatio设置为2,把BeginTime设置为6秒,动画就在3秒后开始。 |
AccelerationRatio | 定义加速度(默认值为0)(在动画中,值不一定是线性变化的。可以指定加减速度) |
DecelerationRatio | 定义减速度(默认值为0)(和加速度的总和不能超过1) |
Duration | 指定动画重复一次的时间长度 |
RepeatBehavior | 指定动画的重复次数或者重复时间(默认值为1) |
FillBehavior | 指定动画在到达其有效期末尾后的行为。(默认值为HoldEnd)
|
这里说明一下FillBehavior的用法:
可以看到XAML中有一个Completed属性,这是一个事件表示动画完成后的响应。
private void DoubleAnimation_Completed(object sender, EventArgs e) { this.ellipse.Width = 10; }
- 若是将FillBehavior设置为HoldEnd的话,响应事件后并不会将Width设置为10,因为时间线并没有停止,如果去单独加个按钮设置也一样。只有该为Stop停止时间线后设置才有效。
- Storyboard其实也继承于Timeline,也可以对其设置上表中的值。当对Storyboard设置任一个属性后,所有属于Storyboard的Timeline的FillBehavior值都以Storyboard的FillBehavior为准。