Animation and Timing System Overview

This topic describes how the timing system uses the animation, Timeline, and Clock classes to animate properties.

Prerequisites

To understand this topic, you should be able to use WPF animations to animate properties, as described in the Animation Overview. It also helps to be familiar with dependency properties; for more information, see the Dependency Properties Overview.

Timelines and Clocks

The Animation Overview described how a Timeline represents a segment of time, and an animation is a type of Timeline that produces output values. By itself, a Timeline, doesn't do anything other than just describe a segment of time. It's the timeline's Clock object that does the real work. Likewise, animation doesn't actually animate properties: an animation class describes how output values should be calculated, but it’s the Clock that was created for the animation that drives the animation output and applies it to properties.

A Clock is a special type of object that maintains timing-related run-time state for the Timeline. It provides three bits of information that are essential to the animation and timing system: CurrentTime, CurrentProgress, and CurrentState. A Clock determines its current time, progress, and state by using the timing behaviors described by its Timeline: Duration, RepeatBehavior, AutoReverse, and so on.

In most cases, a Clock is created automatically for your timeline. When you animate by using a Storyboard or the BeginAnimation method, clocks are automatically created for your timelines and animations and applied to their targeted properties. You can also create a Clock explicitly by using the CreateClock method of your Timeline. The MediaTimeline.CreateClock method creates a clock of the appropriate type for the Timeline on which it is called. If the Timeline contains child timelines, it creates Clock objects for them as well. The resulting Clock objects are arranged in trees that match the structure of the Timeline objects tree from which they are created.

There are different types of clocks for different types of timelines. The following table shows the Clock types that correspond to some of the different Timeline types.

You can apply any AnimationClock objects you create to compatible dependency properties by using the ApplyAnimationClock method.

In performance-intensive scenarios, such as animating large numbers of similar objects, managing your own Clock use can provide performance benefits.

Clocks and the Time Manager

When you animate objects in WPF, it’s the time manager that manages the Clock objects created for your timelines. The time manager is the root of a tree of Clock objects and controls the flow of time in that tree. A time manager is automatically created for each WPF application and is invisible to the application developer. The time manager "ticks" many times per second; the actual number of ticks that occur each second varies depending on available system resources. During each one of these ticks, the time manager computes the state of all Active Clock objects in the timing tree.

The following illustration shows the relationship between the time manager, and AnimationClock, and an animated dependency property.

Animating a property

When the time manager ticks, it updates the time of every Active Clock in the application. If the Clock is an AnimationClock, it uses the GetCurrentValue method of the AnimationTimeline from which it was created to calculate its current output value. The AnimationClock supplies the AnimationTimeline with the current local time, an input value, which is typically the base value of the property, and a default destination value. When you retrieve the value of an animated by property using the GetValue method or its CLR accessor, you get the output of its AnimationClock.

Clock Groups

The preceding section described how there are different types of Clock objects for different types of timelines. The following illustration shows the relationship between the time manager, a ClockGroup, an AnimationClock, and an animated dependency property. A ClockGroup is created for timelines that group other timelines, such as the Storyboard class, which groups animations and other timelines.

A ClockGroup

Composition

It's possible to associate multiple clocks with a single property, in which case each clock uses the output value of the preceding clock as its base value. The following illustration shows three AnimationClock objects applied to the same property. Clock1 uses the base value of the animated property as its input and uses it to generate output. Clock2 takes the output from Clock1 as its input and uses it to generate output. Clock3 takes the output from Clock2 as its input and uses it to generate output. When multiple clocks affect the same property simultaneously, they are said to be in a composition chain.

A composition chain

Note that although a relationship is created among the input and output of the AnimationClock objects in the composition chain, their timing behaviors are not affected; Clock objects (including AnimationClock objects) have a hierarchical dependency on their parent Clock objects.

To apply multiple clocks to the same property, use the Compose HandoffBehavior when applying a Storyboard, animation, or AnimationClock.

Ticks and Event Consolidation

In addition to calculating output values, the time manager does other work every time it ticks: it determines the state of each clock and raises events as appropriate.

While ticks occur frequently, it's possible for a lot of things to happen between ticks. For example, a Clock might be stopped, started, and stopped again, in which case its CurrentState value will have changed three times. In theory, the CurrentStateInvalidated event could be raised multiple times in a single tick; however, the timing engine consolidates events, so that the CurrentStateInvalidated event can be raised at most once per tick. This is true for all timing events: at most one event of each type is raised for a given Clock object.

When a Clock switches states and returns back to its original state between ticks (such as changing from Active to Stopped and back to Active), the associated event still occurs.

For more information about timing events, see the Timing Events Overview.

Current Values and Base Values of Properties

An animatable property can have two values: a base value and a current value. When you set property using its CLR accessor or the SetValue method, you set its base value. When a property is not animated, its base and current values are the same.

When you animate a property, the AnimationClock sets the property's current value. Retrieving the property's value through its CLR accessor or the GetValue method returns the output of the AnimationClock when the AnimationClock is Active or Filling. You can retrieve the property's base value by using the GetAnimationBaseValue method.

See also

• Animation Overview
• Timing Events Overview
• Timing Behaviors Overview