Files
docs-desktop/dotnet-desktop-guide/framework/wpf/graphics-multimedia/how-to-animate-size-changes-by-using-key-frames.md
T
Andy De George da363692ff Initial WPF content migrated (#17)
* 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
2020-09-04 09:46:28 -07:00

2.7 KiB

title, ms.date, helpviewer_keywords, ms.assetid
title ms.date helpviewer_keywords ms.assetid
How to: Animate Size Changes by Using Key Frames 03/30/2017
key frames [WPF], animating size changes with
animation [WPF], size changes with key frames
size changes [WPF], animating with key frames
86bd2950-d4c9-4ec4-aa8d-7dc3ccadded4

How to: Animate Size Changes by Using Key Frames

This example shows how to animate size changes by using key frames.

Example

The following example uses the xref:System.Windows.Media.Animation.SizeAnimationUsingKeyFrames class to animate the xref:System.Windows.Media.ArcSegment.Size%2A property of an xref:System.Windows.Media.ArcSegment. This animation uses three key frames in the following manner:

  1. During the first half second of the animation, uses an instance of the xref:System.Windows.Media.Animation.LinearSizeKeyFrame class to gradually increase the size of the arc. Linear key frames like xref:System.Windows.Media.Animation.LinearSizeKeyFrame create a smooth linear transition between values.

  2. At the end of the next half second, uses an instance of the xref:System.Windows.Media.Animation.DiscreteSizeKeyFrame class to suddenly increase the size of the arc. Discrete key frames like xref:System.Windows.Media.Animation.DiscreteSizeKeyFrame create sudden jumps between values, that is, the size changes occur suddenly and are not subtle.

  3. Over the final two seconds, uses an instance of the xref:System.Windows.Media.Animation.SplineSizeKeyFrame class to increase the size of the arc. Spline key frames like xref:System.Windows.Media.Animation.SplineSizeKeyFrame create a variable transition between values according to the values of the xref:System.Windows.Media.Animation.SplineSizeKeyFrame.KeySpline%2A property. In this example, the size of the arc increases slowly at first and then increases exponentially toward the end of the time segment.

[!code-xamlkeyframes_snip#SizeAnimationUsingKeyFramesWholePage]

For the complete sample, see KeyFrame Animation Sample.

See also