Blog
Windows 8 using XAML: BeginTime Animation Property
By Ken Getz | February 19, 2013
If your storyboard contains more than one simultaneous animation, you may need to delay the start of one or more of the animations. To add this behavior,you can set the BeginTime property so that specific animations delay.
Taking the previous examples, imagine that you want the circle to move fromleft to right and back again, and on the second pass, increase the height, and later, the width of the circle as well. Although all three animations exist within the same storyboard, only one of the animations starts immediately-the other two delay for a fixed period of time.
The following markup the BeginTime property to modify the start time for specific animations within the storyboard:>/p>
<Storyboard TargetName="circle"><DoubleAnimationStoryboard.TargetProperty="(Canvas.Left)"From="10"
To="300"AutoReverse="True"RepeatBehavior="3x"Duration="0:0:2" /><DoubleAnimationStoryboard.TargetProperty="Height"EnableDependentAnimation="True"By="100"AutoReverse="True"BeginTime="0:0:4"Duration="0:0:2" /><DoubleAnimationStoryboard.TargetProperty="Width"EnableDependentAnimation="True"By="100"AutoReverse="True"BeginTime="0:0:6"Duration="0:0:2" /></Storyboard>TIP: If you create a storyboard that contains multiple animations for a single object, you can save some typing by "factoring out" the TargetName property, and applying it to the storyboard rather than to each individual animation.
You may find it worthwhile to investigate the rest of the animation properties, as well-they all play a part in creating interesting and useful animations.
This post is an excerpt from the online courseware for our Windows 8 Using XAML: Bindings, Shapes, and Animation course written by expert Ken Getz.
