Silverlight动画控制和创建.docx

Silverlight动画创建和操作在Silverlight中，我们常使用StoryBoard（故事板）来实现类似于动画的效果。Silverlight 2.0 动画分为以下几类：1、ColorAnimation-在两个Color值之间做线性内插动画处理2、DoubleAnimation-在两个Double值之间做线性内插动画处理3、PointAnimation-在两个Point值之间做线性内插动画处理4、内插关键帧动画-在Color或Double或Point动画中内插关键帧，以做线性,离散,三次贝塞尔曲线的动画处理5、动态改变动画-通过程序控制，动态地改变动画本例我们将建立上面所提的两种类型的动画（ColorAnimation 和 DoubleAnimation ），并以此为基础，示范：1、如何在后台操作动画(运行，暂停，继续，终止)2、如何在后台用代码动态设置动画中的有关参数(如:AutoReverse,BeginTime,FillBehavior等等)3、如何在后对号动态地指派某个动画给指定的控件4、如何在后台用代码动态地创建动画并指派给某个控件。下面我们来完成我们的任务还是照常，我们首先建立新Silverlight应用程序，命名为:MyStoryBoard在Silverligth项目MyStoryBoard下我们编辑page.xaml文件，代码如下:分析上述代码，我们建立了:1、两个椭圆形，分别命名为:ellipseLeft和ellipseRight，作为动画效果的载体2、创建了三个动画，其中一个ColorAnimation类型，两个DoubleAnimation类型，它们都在一个Storyboard中(名为leftEllipseStory)，一开始，这个动画默认的Target是ellipseLeft。3、我们还建立了四个按钮(btnLeftOpen,btnLeftPause,btnLeftPause,btnLeftStop)来控制动画的播放。4、另外,我们建立了两个按钮分别名为btnRightOpenAssign和btnRightOpenCreate.其中,btnRightOpenAssign用于实现在后台代码动态地指派动画给指定控件，在此处，我们实现有后台代码动态地把原本指向 ellipseLeft的动画动态地重新指派给ellipseRight,这样，在当我们点击btnRightOpenAssign按钮后，我们可以看到 原先展示在ellipseLeft控件上的动画现在展示在了ellipseRight控件上了。而btnRightOpenCreate按钮则实现用后台代码来动态地创建动画,然后把它指派给我们指定的ellipseRight控件，这是一个有淡出效果的动画。后台代码分析:1、有关动画属性参数的设置代码/设置动画是否回卷操作leftEllipseStory.AutoReverse=true;/设置动画将要开始的时间，在此可设置其延迟开始的时间leftEllipseStory.BeginTime=System.TimeSpan.FromSeconds(1);/当动画到达其活动时间的结束时点时将如何动作leftEllipseStory.FillBehavior=FillBehavior.Stop;/修改RepeatBehavior属性方法示例#regionRepeatBehavior示例一/leftEllipseStory.RepeatBehavior=RepeatBehavior.Forever;/设置重复动画的次数/一个迭代Count，指定时间线将要播放的次数；/一个TimeSpan值，指定此时间线活动周期的总长度；/或者特殊值Forever，指定时间线应该无限重复。 /默认值是RepeatBehavior的Count为1，该值指示时间线播放一次。#endregion#regionRepeatBehavior示例二RepeatBehaviorrbc=newRepeatBehavior(6);leftEllipseStory.RepeatBehavior=rbc;#endregion/Duration表示Timeline处于活动状态的持续时间Durationdr=newDuration(TimeSpan.FromMilliseconds(500);leftEllipseStory.Duration=dr;/指定此时间线的时间相对于其父级速度的前进速率，越大越快leftEllipseStory.SpeedRatio=7;/一个大于0的有限值，指定此时间线的时间相对于其父级速度的前进速率。/如果此时间线为根时间线，则此属性指定默认时间线速度。该值用因子表示，/其中1表示正常速度，2表示双倍速度，0.5为半速，依此类推。2、有关动画控制的代码leftEllipseStory.Begin();leftEllipseStory.Pause();leftEllipseStory.Resume();leftEllipseStory.Stop();3、有关指派动画给指定控件的代码，共有三种方式来达到此目的#region方法一this.leftEllipseStory.SetValue(Storyboard.TargetNameProperty, ellipseRight);/通过代码动态设定TargetNameProperty值，从而把某个动画指定给某个控件#endregion#region方法二Storyboard.SetTargetName(leftEllipseStory,ellipseRight);/把对象的名称传递给leftEllipseStory#endregion#region方法三Storyboard.SetTarget(leftEllipseStory,ellipseRight);/把对象传递给leftEllipseStory#endregion4、有关动态创建动画并进行指派的代码Storyboardnewstb=newStoryboard();Storyboard.SetTarget(newstb,ellipseRight);/注意：在此处不能用 Storyboard.SetTargetName(newstb,ellipseRight)方法DoubleAnimationnewDbAnim=newDoubleAnimation();newDbAnim.From=1.00;newDbAnim.To=0.0;Storyboard.SetTargetProperty(newDbAnim,newPropertyPath(UIElement.Opacity);newstb.Children.Add(newDbAnim);Page.xaml.cs全部代码如下:usingSystem;usingSystem.Collections.Generic;usingSystem.Linq;usingSystem.Net;usingSystem.Windows;usingSystem.Windows.Controls;usingSystem.Windows.Documents;usingSystem.Windows.Input;usingSystem.Windows.Media;usingSystem.Windows.Media.Animation;usingSystem.Windows.Shapes;usingSystem.Windows.Browser;namespaceMyStoryBoardpublicpartialclassPage:UserControlpublicPage()InitializeComponent();privatevoidbtnLeftOpen_Click(objectsender,RoutedEventArgse)/设置动画是否回卷操作leftEllipseStory.AutoReverse=true;/设置动画将要开始的时间，在此可设置其延迟开始的时间leftEllipseStory.BeginTime=System.TimeSpan.FromSeconds(1);/当动画到达其活动时间的结束时点时将如何动作leftEllipseStory.FillBehavior=FillBehavior.Stop;/修改RepeatBehavior属性方法示例#regionRepeatBehavior示例一/leftEllipseStory.RepeatBehavior=RepeatBehavior.Forever;/设置重复动画的次数/一个迭代Count，指定时间线将要播放的次数；/一个TimeSpan值，指定此时间线活动周期的总长度；/或者特殊值Forever，指定时间线应该无限重复。 /默认值是RepeatBehavior的Count为1，该值指示时间线播放一次。#endregion#regionRepeatBehavior示例二RepeatBehaviorrbc=newRepeatBehavior(6);leftEllipseStory.RepeatBehavior=rbc;#endregion/Duration表示Timeline处于活动状态的持续时间Durationdr=newDuration(TimeSpan.FromMilliseconds(500);leftEllipseStory.Duration=dr;/指定此时间线的时间相对于其父级速度的前进速率，越大越快leftEllipseStory.SpeedRatio=7;/一个大于0的有限值，指定此时间线的时间相对于其父级速度的前进速率。/如果此时间线为根时间线，则此属性指定默认时间线速度。该值用因子表示，/其中1表示正常速度，2表示双倍速度，0.5为半速，依此类推。leftEllipseStory.Begin();privatevoidbtnLeftPause_Click(objectsender,RoutedEventArgse)leftEllipseStory.Pause();privatevoidbtnLeftResume_Click(objectsender,RoutedEventArgse)leftEllipseStory.Resume();privatevoidbtnLeftStop_Click(objectsender,RoutedEventArgse)leftEllipseStory.Stop();MessageBox.Show(动画已经结束);privatevoidleftEllipseStory_Completed(objectsender,EventArgse)leftEllipseStory.Stop();privatevoidbtnRightOpenAssign_Click(objectsender,RoutedEventArgse)/把一个预制的动画指派给指定控件的方法有三个#region方法一/ this.leftEllipseStory.SetValue(Storyboard.TargetNameProperty, ellipseRight);/通过代码动态设定TargetNameProperty值，从而把某个动画指定给某个控件#endregion#region方法二/Storyboard.SetTargetName(leftEllipseStory,ellipseRight);/把对象的名称传递给leftEllipseStory#endregion#region方法三Storyboard.SetTarget(leftEllipseStory,ellipseRight);/把对象传递给leftEllipseStory#endregionleftEllipseStory.Begin();privatevoidbtnRightOpenCreate_Click(objectsender,RoutedEventArgse)/后台代码创建动画对象再指派给指定控件Storyboardnewstb=newStoryboard();Storyboard.SetTarget(newstb,ellipse