Elastic​Ease Elastic​Ease Elastic​Ease Class

Definition

Represents an easing function that creates an animation that resembles a spring oscillating back and forth until it comes to rest.

public sealed class ElasticEase : EasingFunctionBase, IElasticEasepublic sealed class ElasticEase : EasingFunctionBase, IElasticEasePublic NotInheritable Class ElasticEase Inherits EasingFunctionBase Implements IElasticEase
<ElasticEase .../>
Inheritance
Attributes
Windows 10 requirements
Device family
Windows 10 (introduced v10.0.10240.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v1)

Inherited Members

Inherited methods

Inherited properties

Remarks

ElasticEase is one of the two easing functions that can produce a value outside of the normal From/To range. (The other is BackEase.) As the easing function begins, the value oscillates positive and negative around the From value until it reaches an eventual positive amplitude that is the To value. The Springiness property modifies the sinusoidal character of this oscillation. With Springiness of 0, the oscillation is basically sinusoidal and resembles a typical diagram of a spring's motion. With larger Springiness values, it's like dampening the spring's motion.

The Oscillations property declares how many times the function oscillates and crosses into values that are actually below the starting From value.

You might get best results by just experimenting with the Springiness, Oscillations and EasingMode properties until the animation is visually doing what you want for your animated property value scenario.

BounceEase is a similar easing function that works well for physics emulation in animations. The difference with ElasticEase is that a BounceEase won't ever go outside the From/To range. Another way to conceptualize the two easing functions is that ElasticEase is what you might use to animate the plucking of a string, whereas BounceEase is what you might use to show the bounce of a ball against a line or plane.

An easing function can be applied to the EasingFunction properties of From/To/By animations, or to the EasingFunction properties of key-frame types used for the Easing variants of key-frame animations. For more info, see Key-frame animations and easing function animations.

Examples

This XAML example applies an ElasticEase easing function to a DoubleAnimation to create an animation that resembles a spring oscillating back and forth until it comes to rest.

<StackPanel x:Name="LayoutRoot" >
    <StackPanel.Resources>
        <Storyboard x:Name="myStoryboard">
            <DoubleAnimation From="1" To="6" Duration="00:00:3" 
                Storyboard.TargetName="rectScaleTransform" 
                Storyboard.TargetProperty="ScaleY">
                <DoubleAnimation.EasingFunction>
                    
                    <!-- Elastic easing function assigned to From/To animation -->
                    <ElasticEase x:Name="myElasticEase" Oscillations="3" 
                     Springiness="1" EasingMode="EaseOut"/>
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>
    </StackPanel.Resources>

    <Rectangle PointerPressed="Pointer_Clicked" 
     Fill="Blue" Width="200" Height="30">
        <Rectangle.RenderTransform>
            <ScaleTransform x:Name="rectScaleTransform" />
        </Rectangle.RenderTransform>
    </Rectangle>

</StackPanel>
// When the user clicks the rectangle, the animation
// begins. 
private void Pointer_Clicked(object sender, PointerRoutedEventArgs e)
{
    myStoryboard.Begin();
}
' When the user clicks the rectangle, the animation
' begins. 
Private Sub Pointer_Clicked(ByVal sender As Object, ByVal e As PointerRoutedEventArgs)
    myStoryboard.Begin()
End Sub

Constructors

ElasticEase() ElasticEase() ElasticEase()

Initializes a new instance of the ElasticEase class.

public ElasticEase()public ElasticEase()Public Sub New()
Attributes

Properties

Oscillations Oscillations Oscillations

Gets or sets the number of times the target slides back and forth over the animation destination.

public int Oscillations { get; set; }public int Oscillations { get; set; }Public ReadWrite Property Oscillations As int
<ElasticEase Oscillations="int"/>
Value
int int int

The number of times the target slides back and forth over the animation destination. This value must be greater than or equal to 0. The default is 3.

Attributes

OscillationsProperty OscillationsProperty OscillationsProperty

Identifies the Oscillations dependency property.

public static DependencyProperty OscillationsProperty { get; }public static DependencyProperty OscillationsProperty { get; }Public Static ReadOnly Property OscillationsProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the Oscillations dependency property.

Attributes

Springiness Springiness Springiness

Gets or sets the stiffness of the spring. The smaller the Springiness value is, the stiffer the spring and the faster the elasticity decreases in intensity over each oscillation.

public double Springiness { get; set; }public double Springiness { get; set; }Public ReadWrite Property Springiness As double
<ElasticEase Springiness="double"/>
Value
double double double

A positive number that specifies the stiffness of the spring. The default value is 3.

Attributes

SpringinessProperty SpringinessProperty SpringinessProperty

Identifies the Springiness dependency property.

public static DependencyProperty SpringinessProperty { get; }public static DependencyProperty SpringinessProperty { get; }Public Static ReadOnly Property SpringinessProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the Springiness dependency property.

Attributes

See Also