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.2 KiB
title, ms.date, dev_langs, helpviewer_keywords, ms.assetid
| title | ms.date | dev_langs | helpviewer_keywords | ms.assetid | |||||
|---|---|---|---|---|---|---|---|---|---|
| How to: Animate a Rectangle Geometry by Using Key Frames | 03/30/2017 |
|
|
a8b45ceb-0e32-4ba1-928f-df6d30db17c6 |
How to: Animate a Rectangle Geometry by Using Key Frames
This example shows how to animate the xref:System.Windows.Media.RectangleGeometry.Rect%2A property of a xref:System.Windows.Media.RectangleGeometry by using key frames.
Example
The following example uses the xref:System.Windows.Media.Animation.RectAnimationUsingKeyFrames class to animate the xref:System.Windows.Media.RectangleGeometry.Rect%2A property of a xref:System.Windows.Media.RectangleGeometry. This animation uses three key frames in the following manner:
-
During the first two seconds, uses an instance of the xref:System.Windows.Media.Animation.LinearRectKeyFrame class to animate a gradual change in the position, width, and height of a rectangle. Linear key frames like xref:System.Windows.Media.Animation.LinearRectKeyFrame create a smooth linear transition between values.
-
During the end of the next half second, uses an instance of the xref:System.Windows.Media.Animation.DiscreteRectKeyFrame class to suddenly decrease the height of the rectangle. Discrete key frames like xref:System.Windows.Media.Animation.DiscreteRectKeyFrame create sudden changes between values, that is, the decrease in height occurs quickly and is not subtle.
-
During the final two seconds, uses an instance of the xref:System.Windows.Media.Animation.SplineRectKeyFrame class to change the rectangle back to its original size and position. Spline key frames like xref:System.Windows.Media.Animation.SplineRectKeyFrame create a variable transition between values according to the values of the xref:System.Windows.Media.Animation.SplineRectKeyFrame.KeySpline%2A property. In this example, the change begins slowly and speeds up exponentially toward the end of the time segment.
[!code-csharpkeyframes_snip#RectAnimationUsingKeyFramesWholePage] [!code-vbkeyframes_snip#RectAnimationUsingKeyFramesWholePage] [!code-xamlkeyframes_snip#RectAnimationUsingKeyFramesWholePage]
For the complete sample, see KeyFrame Animation Sample.