--- title: "Animation and Timing System Overview" ms.date: "03/30/2017" helpviewer_keywords: - "timing system [WPF]" - "animation [WPF]" ms.assetid: 172cd5a8-a333-4c81-9456-fafccc19f382 --- # Animation and Timing System Overview This topic describes how the timing system uses the animation, , and classes to animate properties. ## Prerequisites To understand this topic, you should be able to use [!INCLUDE[TLA2#tla_winclient](../../../includes/tla2sharptla-winclient-md.md)] animations to animate properties, as described in the [Animation Overview](animation-overview.md). It also helps to be familiar with dependency properties; for more information, see the [Dependency Properties Overview](../advanced/dependency-properties-overview.md). ## Timelines and Clocks The [Animation Overview](animation-overview.md) described how a represents a segment of time, and an animation is a type of that produces output values. By itself, a , doesn't do anything other than just describe a segment of time. It's the timeline's 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 that was created for the animation that drives the animation output and applies it to properties. A is a special type of object that maintains timing-related run-time state for the . It provides three bits of information that are essential to the animation and timing system: , , and . A determines its current time, progress, and state by using the timing behaviors described by its : , , , and so on. In most cases, a is created automatically for your timeline. When you animate by using a or the method, clocks are automatically created for your timelines and animations and applied to their targeted properties. You can also create a explicitly by using the method of your . The method creates a clock of the appropriate type for the on which it is called. If the contains child timelines, it creates objects for them as well. The resulting objects are arranged in trees that match the structure of the objects tree from which they are created. There are different types of clocks for different types of timelines. The following table shows the types that correspond to some of the different types. |Timeline type|Clock type|Clock purpose| |-------------------|----------------|-------------------| |Animation (inherits from )||Generates output values for a dependency property.| |||Processes a media file.| |||Groups and controls its child objects| |||Groups and controls its child objects| You can apply any objects you create to compatible dependency properties by using the method. In performance-intensive scenarios, such as animating large numbers of similar objects, managing your own use can provide performance benefits. ## Clocks and the Time Manager When you animate objects in [!INCLUDE[TLA2#tla_winclient](../../../includes/tla2sharptla-winclient-md.md)], it’s the time manager that manages the objects created for your timelines. The time manager is the root of a tree of objects and controls the flow of time in that tree. A time manager is automatically created for each [!INCLUDE[TLA2#tla_winclient](../../../includes/tla2sharptla-winclient-md.md)] 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 objects in the timing tree. The following illustration shows the relationship between the time manager, and , and an animated dependency property. ![Timing system components](./media/graphicsmm-clocks-1clock1prop.png "graphicsmm_clocks_1clock1prop") Animating a property When the time manager ticks, it updates the time of every in the application. If the is an , it uses the method of the from which it was created to calculate its current output value. The supplies the 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 method or its CLR accessor, you get the output of its . #### Clock Groups The preceding section described how there are different types of objects for different types of timelines. The following illustration shows the relationship between the time manager, a , an , and an animated dependency property. A is created for timelines that group other timelines, such as the class, which groups animations and other timelines. ![Timing system components](./media/graphicsmm-clocks-2clock1clockgroup2prop.png "graphicsmm_clocks_2clock1clockgroup2prop") 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 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. ![Timing system components](./media/graphicsmm-clocks-2clock1prop.png "graphicsmm_clocks_2clock1prop") A composition chain Note that although a relationship is created among the input and output of the objects in the composition chain, their timing behaviors are not affected; objects (including objects) have a hierarchical dependency on their parent objects. To apply multiple clocks to the same property, use the when applying a , animation, or . #### 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 might be stopped, started, and stopped again, in which case its value will have changed three times. In theory, the event could be raised multiple times in a single tick; however, the timing engine consolidates events, so that the 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 object. When a switches states and returns back to its original state between ticks (such as changing from to and back to ), the associated event still occurs. For more information about timing events, see the [Timing Events Overview](timing-events-overview.md). ## 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 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 sets the property's *current* value. Retrieving the property's value through its CLR accessor or the method returns the output of the when the is or . You can retrieve the property's base value by using the method. ## See also - [Animation Overview](animation-overview.md) - [Timing Events Overview](timing-events-overview.md) - [Timing Behaviors Overview](timing-behaviors-overview.md)