• Article

DoubleAnimation.EasingFunction Property

Microsoft Silverlight will reach end of support after October 2021. Learn more.

Gets or sets the easing function applied to this animation.

Namespace:  System.Windows.Media.Animation
Assembly:  System.Windows (in System.Windows.dll)

Syntax

'Declaration
Public Property EasingFunction As IEasingFunction

public IEasingFunction EasingFunction { get; set; }

<DoubleAnimation>
  <DoubleAnimation.EasingFunction>
    singleEasingFunction
  </DoubleAnimation.EasingFunction>
</DoubleAnimation>

XAML Values

  • singleEasingFunction
    A single object element for an easing function type that derives from EasingFunctionBase, for example, <PowerEase/>.

Property Value

Type: System.Windows.Media.Animation.IEasingFunction
The easing function applied to this animation.

Remarks

Dependency property identifier field: EasingFunctionProperty

Easing functions allow you to apply custom mathematical formulas to your animations. For example, you may want an object to realistically bounce or behave as though it were on a spring. You could use Key-Frame or even From/To/By animations to approximate these effects but it would take a significant amount of work and the animation would be less accurate than using a mathematical formula.

Besides creating your own custom easing function by implementing the IEasingFunction interface, you can use one of several easing functions provided by the runtime to create common effects. The Easing Function Gallery provides examples of available prefabricated easing functions.

Examples

The following example applies a BounceEase easing function to a DoubleAnimation to create a bouncing effect.

    <StackPanel x:Name="LayoutRoot" Background="White">
        <StackPanel.Resources>
            <Storyboard x:Name="myStoryboard">
                <DoubleAnimation From="30" To="200" Duration="00:00:3" 
                    Storyboard.TargetName="myRectangle" 
                    Storyboard.TargetProperty="Height">
                    <DoubleAnimation.EasingFunction>
                        <BounceEase Bounces="4" EasingMode="EaseOut" 
                                    Bounciness="1.8" />
                    </DoubleAnimation.EasingFunction>
                </DoubleAnimation>
            </Storyboard>
        </StackPanel.Resources>

        <Rectangle x:Name="myRectangle" MouseLeftButtonDown="Mouse_Clicked" 
         Fill="Blue" Width="200" Height="30" />

    </StackPanel>

        // When the user clicks the rectangle, the animation
        // begins. 
        private void Mouse_Clicked(object sender, MouseEventArgs e)
        {
            myStoryboard.Begin();
        }

Version Information

Silverlight

Supported in: 5, 4, 3

Silverlight for Windows Phone

Supported in: Windows Phone OS 7.1, Windows Phone OS 7.0

Platforms

For a list of the operating systems and browsers that are supported by Silverlight, see Supported Operating Systems and Browsers.