BounceEase
BounceEase
BounceEase
BounceEase
Class
Definition
Represents an easing function that creates an animated bouncing effect.
public : sealed class BounceEase : EasingFunctionBase, IBounceEasepublic sealed class BounceEase : EasingFunctionBase, IBounceEasePublic NotInheritable Class BounceEase Inherits EasingFunctionBase Implements IBounceEase// This API is not available in Javascript.
<BounceEase .../>
- Inheritance
-
BounceEaseBounceEaseBounceEaseBounceEase
- Attributes
| Device family |
Windows 10 (introduced v10.0.10240.0)
|
| API contract |
Windows.Foundation.UniversalApiContract (introduced v1)
|
Inherited Members
Inherited methods
Inherited properties
Examples
The following example applies a BounceEase easing function to a DoubleAnimation to create a bouncing effect.
<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>
<BounceEase Bounces="2" EasingMode="EaseOut"
Bounciness="2" />
</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
Remarks
BounceEase has two controlling properties Bounciness and Bounces that affect the behavior of the function.
ElasticEase is a similar easing function that works well for physics emulation in animations. The difference with BounceEase is that an ElasticEase can 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.
Constructors
BounceEase() BounceEase() BounceEase() BounceEase()
Initializes a new instance of the BounceEase class.
public : BounceEase()public BounceEase()Public Sub New()// This API is not available in Javascript.
Properties
Bounces Bounces Bounces Bounces
Gets or sets the number of bounces.
public : int Bounces { get; set; }public int Bounces { get; set; }Public ReadWrite Property Bounces As int// This API is not available in Javascript.
<BounceEase Bounces="int" .../>
- Value
- int int int int
The number of bounces. The value must be greater or equal to zero. Negative values will resolve to zero. The default is 3.
BouncesProperty BouncesProperty BouncesProperty BouncesProperty
Identifies the Bounces dependency property.
public : static DependencyProperty BouncesProperty { get; }public static DependencyProperty BouncesProperty { get; }Public Static ReadOnly Property BouncesProperty As DependencyProperty// This API is not available in Javascript.
The identifier for the Bounces dependency property.
Bounciness Bounciness Bounciness Bounciness
Gets or sets a value that specifies how bouncy the bounce animation is. Low values of this property result in bounces with little loss of height between bounces (more bouncy) while high values result in dampened bounces (less bouncy).
public : double Bounciness { get; set; }public double Bounciness { get; set; }Public ReadWrite Property Bounciness As double// This API is not available in Javascript.
<BounceEase Bounciness="double" .../>
- Value
- double double double double
The value that specifies how bouncy the bounce animation is. This value must be positive. The default value is 2.
BouncinessProperty BouncinessProperty BouncinessProperty BouncinessProperty
Identifies the Bounciness dependency property.
public : static DependencyProperty BouncinessProperty { get; }public static DependencyProperty BouncinessProperty { get; }Public Static ReadOnly Property BouncinessProperty As DependencyProperty// This API is not available in Javascript.
The identifier for the Bounciness dependency property.