|
|
|
There
are three key concepts in the animation programming model.
|
|
|
|
Triggers
control when animations are launched.
|
|
Elements,
styles and templates can have a Triggers section. This can contain two kinds
of trigger: event triggers and property triggers. Property triggers are
level-based a trigger is on if the specified property matches a certain
value, otherwise it is off. This level-based nature means that property
triggers cannot be used for starting animations, since this requires a
trigger at a particular moment in time.
|
|
|
|
Event
triggers are edge-based rather than level-based – an event trigger fires when
its chosen event is raised, or when a property changes state.
|
|
|
|
For
example, you could use the Mouse.MouseEnter event to trigger a particular
animation. Or you can specify a set of animations to run when a particular
property-based trigger becomes true, and a second set to run when it becomes
false.
|
|
|
|
|
|
Timelines
represent a particular stretch of time, and usually define something that
happens during that time. Timelines can be composed into hierarchies,
allowing multiple animations to be orchestrated.
|
|
Everything
inside a Storyboard element is a Timeline of some description. All element
types that derive from Timeline represent some particular stretch of time.
They all have a BeginTime (which in the case of nested timelines is relative
to their parent’s BeginTime). All timelines have a Duration, although the
Duration may be implicit – if you do not specify a timeline’s Duration, it
will be determined by the end times of the children – whichever child
animation finishes last, its finish time determines the parent’s implied
duration.
|
|
ParallelTimeline
elements are used to group other animations together.
|
|
Animation
timelines such as DoubleAnimation or ColorAnimation indicate how the target
property is to be animated.
|
|
|
|
Animations
describe how a particular property is to be changed by the animation system.
|
|
Animation
timeline must be of a type matching the target property, e.g. DoubleAnimation
for a property of type Double, ColorAnimation for one of Color, etc. This
describes the way in which the property should be animated.
|
|
|
|
The
Storyboard.TargetName indicates the element to be animated. It specifies the
name of the target element – this must correspond to the x:Name attribute of
an element derived from FrameworkElement. The Storyboard.TargetProperty
attribute indicates the name of the property to be animated. The property
must always be specified as (ElementType.PropertyName).
|
|
|
|
It is
possible to drill into subproperties with the path. For example, if the
target element’s Fill property were set to be a SolidColorBrush, you could
use a Path of “(Ellipse.Fill).(SolidColorBrush.Color)” to animate the brush
color. (This is the only way to animate a brush – the Brush class does not
derive from FrameworkElement, so it cannot be specified as the
Storyboard.TargetName.)
|
|
|