Andy De George
da363692ff
* Reset branch for WPF changes * Convert BMP to PNG; fix link-out-of-scope err * Add snippets for WPF... 6794 files!!!! * Add missing snippets * update file updated between migration * Fix paths to include * update breadcrumb and toc * fix index links * fix index links * fix index links * fix markdown
3.7 KiB
title, ms.date, dev_langs, helpviewer_keywords, ms.assetid
| title | ms.date | dev_langs | helpviewer_keywords | ms.assetid | |||||
|---|---|---|---|---|---|---|---|---|---|
| How to: Animate a Point by Using Key Frames | 03/30/2017 |
|
|
d2e2ef10-0773-4133-856e-d41c09f60ded |
How to: Animate a Point by Using Key Frames
This example shows how to use the xref:System.Windows.Media.Animation.PointAnimationUsingKeyFrames class to animate a xref:System.Windows.Point.
Example
The following example moves an ellipse along a triangular path. The example uses the xref:System.Windows.Media.Animation.PointAnimationUsingKeyFrames class to animate the xref:System.Windows.Media.EllipseGeometry.Center%2A property of an xref:System.Windows.Media.EllipseGeometry. This animation uses three key frames in the following manner:
-
During the first half second, uses an instance of the xref:System.Windows.Media.Animation.LinearPointKeyFrame class to move the ellipse along a path at a steady rate from its starting position. Linear key frames like xref:System.Windows.Media.Animation.LinearPointKeyFrame create a smooth linear interpolation between values.
-
During the end of the next half second, uses an instance of the xref:System.Windows.Media.Animation.DiscretePointKeyFrame class to suddenly move the ellipse along the path to the next position. Discrete key frames like xref:System.Windows.Media.Animation.DiscretePointKeyFrame create sudden jumps between values.
-
During the final two seconds, uses an instance of the xref:System.Windows.Media.Animation.SplinePointKeyFrame class to move the ellipse back to its starting position. Spline key frames like xref:System.Windows.Media.Animation.SplinePointKeyFrame create a variable transition between values according to the values of the xref:System.Windows.Media.Animation.SplinePointKeyFrame.KeySpline%2A property. In this example, the animation begins slowly and speeds up exponentially toward the end of the time segment.
[!code-csharpkeyframes_snip#PointAnimationUsingKeyFramesWholePage] [!code-vbkeyframes_snip#PointAnimationUsingKeyFramesWholePage] [!code-xamlkeyframes_snip#PointAnimationUsingKeyFramesWholePage]
For the complete sample, see KeyFrame Animation Sample.
For consistency with other animation examples, the code versions of this example use a xref:System.Windows.Media.Animation.Storyboard object to apply the xref:System.Windows.Media.Animation.PointAnimationUsingKeyFrames. However, when applying a single animation in code, it's simpler to use the xref:System.Windows.Media.Animation.Animatable.BeginAnimation%2A method instead of using a xref:System.Windows.Media.Animation.Storyboard. For an example, see Animate a Property Without Using a Storyboard.