Slow and steady Silverlight (11)

Slow and steady Silverlight (11)-2.0 animation coloranimation,doubleanimation,pointanimation, interpolation key frame animation

Introduced

Silverlight 2.0 Animation:

ColorAnimation-linear interpolation animation between two Color values

DoubleAnimation-linear interpolation animation between two Double values

PointAnimation-linear interpolation animation between two point values

Interpolation Keyframe Animation-inserts key frames in a Color or Double or point animation to do linear, discrete, three-time Bezier curve animation

Dynamically changing animations-dynamically changing animations by program control

Online Demo

Http://www.cnblogs.com/webabcd/archive/2008/10/09/1307486.html

Example

1, Coloranimation.xaml

<usercontrol x:class= "Silverlight20.Animation.ColorAnimation"
Xmlns= "Http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x= "Http://schemas.microsoft.com/winfx/2006/xaml" >
<stackpanel horizontalalignment= "Left" >

<ellipse x:name= "Ellipse" fill= "Red" width= ">" height= "
<Ellipse.Triggers>

<!--
RoutedEvent-routed event for the owning object, only loaded this event
-->
<eventtrigger routedevent= "ellipse.loaded" >
<beginstoryboard x:name= "BeginStoryboard" >
<storyboard x:name= "Storyboard" >

<!--coloranimation-linear interpolation animation between two Color values-->
<!--
Storyboard.TargetName-The name of the object to animate
Storyboard.TargetProperty-Properties of the object to animate
BeginTime-the timeline will not start playing until the begintime time is triggered
TimeSpan-[-][Day.] When: minutes: seconds [. 1 digits to 7 seconds after the decimal] (can be positive; can be negative; nullable; default is 0)
From-Animation starting value
To-animation end value
By-animation starts from the starting value, the total amount of change required (to precedence by by)
Duration-Timeline Duration
TimeSpan-[-][Day.] When: minutes: seconds [. 1 digits to 7 seconds after the decimal]
Automatic-Automatic determination
Forever-Infinite length
AutoReverse-whether to return the original path after the animation completes. The default value is False
RepeatBehavior-time, times, or type of animation repeat playback
TimeSpan-[-][Day.] When: minutes: seconds [. 1 digits to 7 seconds after the decimal]
NX-Number of plays. 1x, 2x, 3x
Forever-Permanent Playback
SpeedRatio-A multiple of the rate of the timeline. Default value 1
Fillbehavior-Behavior after animation [System.Windows.Media.Animation.FillBehavior enum]
Fillbehavior.holdend-the end value of the animated property is retained after the animation finishes. Default value
Fillbehavior.stop-After the animation is finished, the Restore animation property is its initial value
-->
<coloranimation
Storyboard.targetname= "Ellipse"
Storyboard.targetproperty= "(Ellipse.fill). (Solidcolorbrush.color) "
Begintime= "00:00:0"
From= "Red"
To= "Yellow"
duration= "Automatic"
Autoreverse= "True"
repeatbehavior= "3x" >
</ColorAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Ellipse.Triggers>
</Ellipse>

</StackPanel>
</UserControl>