CubicBezierEasingFunction
CubicBezierEasingFunction
CubicBezierEasingFunction
CubicBezierEasingFunction
Class
Definition
Represents a cubic-bezier function for interpolating between animation key frames.
The cubic-bezier function is one of the more common easing functions used with KeyFrameAnimation s and are used frequently to describe smooth curves that can be scaled. Cubic-bezier functions are defined by two “control points” of type Vector2 that define the shape of the curve. When used, the animating property will change in between two keyframes based on the defined curve.
public : sealed class CubicBezierEasingFunction : CompositionEasingFunction, ICubicBezierEasingFunctionpublic sealed class CubicBezierEasingFunction : CompositionEasingFunction, ICubicBezierEasingFunctionPublic NotInheritable Class CubicBezierEasingFunction Inherits CompositionEasingFunction Implements ICubicBezierEasingFunction// This API is not available in Javascript.
- Inheritance
-
CompositionEasingFunctionCompositionEasingFunctionCompositionEasingFunctionCompositionEasingFunctionCubicBezierEasingFunctionCubicBezierEasingFunctionCubicBezierEasingFunctionCubicBezierEasingFunction
- Attributes
| Device family |
Windows 10 (introduced v10.0.10240.0)
|
| API contract |
Windows.Foundation.UniversalApiContract (introduced v1)
|
Inherited Members
Inherited methods
Inherited properties
Examples
// Construct the cubic-bezier off your Compositor
CubicBezierEasingFunction cubicBezier = _compositor.CreateCubicBezierEasingFunction(new Vector2(.17f, .67f), new Vector2(1f, 1f));
ScalarKeyFrameAnimation animation = _compositor.CreateScalarKeyFrameAnimation();
// Apply the cubic-bezier to a KeyFrame
animation.InsertKeyFrame(0.0f, 1.0f);
Remarks
There are numerous web services like this one that allow you to visualize how the two control points affect the shape of the cubic-bezier. The values you define here are the same values that get inputted into each Vector2 component.
Properties
ControlPoint1 ControlPoint1 ControlPoint1 ControlPoint1
The first control point for the cubic-bezier interpolation function.
public : Vector2 ControlPoint1 { get; }public Vector2 ControlPoint1 { get; }Public ReadOnly Property ControlPoint1 As Vector2// This API is not available in Javascript.
- Value
- Vector2 Vector2 Vector2 Vector2
The first control point for the cubic-bezier interpolation function.
ControlPoint2 ControlPoint2 ControlPoint2 ControlPoint2
The second control point for the cubic-bezier interpolation function.
public : Vector2 ControlPoint2 { get; }public Vector2 ControlPoint2 { get; }Public ReadOnly Property ControlPoint2 As Vector2// This API is not available in Javascript.
- Value
- Vector2 Vector2 Vector2 Vector2
The second control point for the cubic-bezier interpolation function.