Expression Blend实例中文教程(7) - 动画基础快速入门
通过前面文章学习，已经对Blend的开发界面，以及控件有了初步的认识。本文将讲述Blend的一个核心功能，动画设计。大家也许注意到，从开篇到现在，所有的文章都是属于快速入门，是因为这些文章，都是我曾经学习的经验和工作中使用到的经验总结出来的。在我个人认为，掌握了这些核心功能也就等于掌握了Blend的开发方法。在以后开发项目中使用Blend开发工具，这些知识应该足够用了。当然，特殊项目也需要特殊对待，如果您在项目开发中，有新的Blend开发经验，希望您能够毫不吝啬的分享，在这里，我表示深深的谢意。
?
言归正传，关于Silverlight的动画设计。在讲述Blend设计Silverlight动画之前，我想介绍一些动画设计基础知识。
?
学习Silverlight动画之前，首先需要明确一下三点核心概念：
1. Silverlight动画是基于时间线的；1?<DoubleAnimation?From="20"?To="100"?Duration="0:0:5"></DoubleAnimation>
?
这是一个指定对象的属性值在5秒内从20到100改变的动画，也是最简单的动画语句。这里我们忽略了目标对象属性，后文将有详细代码，这里仅做演示。
?
2.
从上图可以看出，线性插值动画，关键帧动画和StoryBoard都是继承自System.Windows.Media.Animation.Timeline. 也就是说，以上三个类都继承了Timeline的相关属性，下面我们分别看一下Timeline基类属性。
1.??1?<Grid?x:Name="LayoutRoot"?Background="White">
?2????<Grid.Resources>
?3???????<Storyboard?x:Name="Grow"?AutoReverse="True"?>
?4???????????<DoubleAnimation?Storyboard.TargetName="btnGrow"?
?5???????????????Storyboard.TargetProperty="Width"
?6???????????????From="20"?To="100"?Duration="0:0:5">
?7???????????</DoubleAnimation>
?8???????</Storyboard>
?9????</Grid.Resources>
10????<Button?x:Name="btnGrow"?Width="20"?Height="150"?Content="按钮动画"/>
11?</Grid>
?
2.FillBehavior属性设置为HoldEnd。而如果动画的运行周期已结束且FillBehavior的设置为HoldEnd，则说明动画进入填充周期。如果不希望动画在其活动周期结束时保留其值，则将其FillBehavior属性设置为Stop（引自MSDN）。
?1?<Canvas>?2???<Rectangle
?3?????x:Name="MyAnimatedRectangle"
?4?????Width="100"
?5?????Height="100"
?6?????Fill="Blue">
?7?????<Rectangle.Triggers>
?8?
?9???????<!--?Animates?the?rectangle's?opacity.?-->
10???????<EventTrigger?RoutedEvent="Rectangle.Loaded">
11?????????<BeginStoryboard>
12???????????<Storyboard>
13?????????????<DoubleAnimation
14???????????????Storyboard.TargetName="MyAnimatedRectangle"
15???????????????Storyboard.TargetProperty="Opacity"
16???????????????From="1.0"?To="0"?Duration="0:0:5"?FillBehavior="Stop"?/>
17???????????</Storyboard>
18?????????</BeginStoryboard>
19???????</EventTrigger>
20?????</Rectangle.Triggers>
21???</Rectangle>
22?</Canvas>
5.如需转载请注明出处:http://www.ok22.org/art_detail.aspx?id=218【Expression Blend实例中文教程(7) - 动画基础快速入门】