Updated: July 2008
A container timeline that provides object and property targeting information for its child animations.
(in PresentationFramework.dll)
XMLNS for XAML: http://schemas.microsoft.com/winfx/2006/xaml/presentation, http://schemas.microsoft.com/netfx/2007/xaml/presentation
Visual Basic (Declaration)
Public Class Storyboard _
Inherits ParallelTimeline
Dim instance As Storyboard
public class Storyboard : ParallelTimeline
public ref class Storyboard : public ParallelTimeline
public class Storyboard extends ParallelTimeline
XAML Object Element Usage
<Storyboard>
Children
</Storyboard>
Interactively Controlling Storyboards
Data Binding and Animating Timelines
Most timeline properties can be data bound or animated; however, because of the way the timing system works, data bound or animated timelines do not behave like other data bound or animated objects. To understand their behavior, it helps to understand what it means to activate a timeline.
When a timeline is activated, copies are made of the timeline and its child timelines. These copies are frozen (made read-only) and Clock objects are created from them. These clocks do the actual work of animating the targeted properties. If a timeline is data bound or animated, a snapshot of its current values is made when its clock is created. Even though the original timeline might continue to change, its clock does not.
For a timeline to reflect data binding or animation changes, its clock must be re-created. Clocks are not re-created for you automatically. The following are several ways to apply timeline changes:
If the timeline is or belongs to a Storyboard, you can make it reflect changes by reapplying its storyboard using a BeginStoryboard or the Begin method. This has the side effect of also restarting the animation. In code, you can use the Seek method to advance the storyboard back to its previous position.
If you applied an animation directly to a property using the BeginAnimation method, call the BeginAnimation method again and pass it the animation that has been modified.
If you are working directly at the clock level, create and apply a new set of clocks and use them to replace the previous set of created clocks.
For an example of a data bound animation, see Key Spline Animation Sample .
This example shows how to use a Storyboard to animate properties. To animate a property by using a Storyboard, create an animation for each property that you want to animate and also create a Storyboard to contain the animations.
The type of property determines the type of animation to use. For example, to animate a property that takes Double values, use a DoubleAnimation. The TargetName and TargetProperty attached properties specify the object and property to which the animation is applied.
To start a storyboard in Extensible Application Markup Language (XAML), use a BeginStoryboard action and an EventTrigger. The EventTrigger begins the BeginStoryboard action when the event that is specified by its RoutedEvent property occurs. The BeginStoryboard action starts the Storyboard.
The following example uses Storyboard objects to animate two Button controls. To make the first button change in size, its Width is animated. To make the second button change color, the Color property of the SolidColorBrush is used to set the Background of the button that is animated.
<!-- StoryboardExample.xaml
Uses storyboards to animate properties. -->
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
WindowTitle="Animate Properties with Storyboards">
<Border Background="White">
<StackPanel Margin="30" HorizontalAlignment="Left" MinWidth="500">
<TextBlock>Storyboard Animation Example</TextBlock>
<!-- The width of this button is animated. -->
<Button Name="myWidthAnimatedButton"
Height="30" Width="200" HorizontalAlignment="Left">
A Button
<Button.Triggers>
<!-- Animates the width of the first button
from 200 to 300. -->
<EventTrigger RoutedEvent="Button.Click">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="myWidthAnimatedButton"
Storyboard.TargetProperty="Width"
From="200" To="300" Duration="0:0:3" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Button.Triggers>
</Button>
<!-- The color of the brush used to paint this button is animated. -->
<Button Height="30" Width="200"
HorizontalAlignment="Left">Another Button
<Button.Background>
<SolidColorBrush x:Name="myAnimatedBrush" Color="Blue" />
</Button.Background>
<Button.Triggers>
<!-- Animates the color of the brush used to paint
the second button from red to blue . -->
<EventTrigger RoutedEvent="Button.Click">
<BeginStoryboard>
<Storyboard>
<ColorAnimation
Storyboard.TargetName="myAnimatedBrush"
Storyboard.TargetProperty="Color"
From="Red" To="Blue" Duration="0:0:7" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Button.Triggers>
</Button>
</StackPanel>
</Border>
</Page>
If you use code, you must create a NameScope for a FrameworkElement and register the names of the objects to animate with that FrameworkElement. To start the animations in code, use a BeginStoryboard action with an EventTrigger. Optionally, you can use an event handler and the Begin method of Storyboard. The following example shows how to use the Begin method.
For the complete sample, see Property Animation Sample. For more information about animation and storyboards, see Animation Overview.
If you use code, you are not limited to using Storyboard objects in order to animate properties. For more information and examples, see How to: Animate a Property Without Using a Storyboard and How to: Animate a Property by Using an AnimationClock.
More Code
System..::.Object
System.Windows.Threading..::.DispatcherObject
System.Windows..::.DependencyObject
System.Windows..::.Freezable
System.Windows.Media.Animation..::.Animatable
System.Windows.Media.Animation..::.Timeline
System.Windows.Media.Animation..::.TimelineGroup
System.Windows.Media.Animation..::.ParallelTimeline
System.Windows.Media.Animation..::.Storyboard
Any public static (Shared in Visual Basic) members of this type are thread safe. Any instance members are not guaranteed to be thread safe.
Windows 7, Windows Vista, Windows XP SP2, Windows Server 2008 R2, Windows Server 2008, Windows Server 2003
The .NET Framework and .NET Compact Framework do not support all versions of every platform. For a list of the supported versions, see .NET Framework System Requirements.
.NET Framework
Supported in: 3.5, 3.0
Reference
Other Resources
Date | History | Reason |
|---|
July 2008
| Added new members: TargetProperty, Begin()()(), GetTarget(DependencyObject), Pause()()(), Resume()()(), Seek(TimeSpan), Seek(TimeSpan, TimeSeekOrigin), SetSpeedRatio(Double), SetTarget(DependencyObject, DependencyObject), SkipToFill()()(), Stop()()(), SeekAlignedToLastTick(TimeSpan), SeekAlignedToLastTick(TimeSpan, TimeSeekOrigin), GetCurrentTime()()(), GetCurrentState()()(), GetCurrentProgress()()(), GetCurrentIteration()()(), GetCurrentGlobalSpeed()()(), GetIsPaused()()(), Remove()()(), Target |
SP1 feature change.
|