Skip to content

F
Front-End
Unverified Commit ab9f17cb authored by Greg Spencer's avatar Greg Spencer Committed by GitHub
Browse files
Options

Adding curve animations to documentation. (#19681) 

Enables animated curve diagrams in the documentation, replacing the static images.
parent 35b55d51
Hide whitespace changes
Inline Side-by-side
Showing with 40 additions and 40 deletions
packages/flutter/lib/src/animation/curves.dart
View file @ ab9f17cb
......@@ -28,8 +28,8 @@ abstract class Curve {
/// Returns a new curve that is the reversed inversion of this one.
/// This is often useful as the reverseCurve of an [Animation].
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_flipped.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_flipped.mp4}
///
/// See also:
///
......@@ -57,7 +57,7 @@ class _Linear extends Curve {
/// The curve rises linearly from 0.0 to 1.0 and then falls discontinuously back
/// to 0.0 each iteration.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_sawtooth.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_sawtooth.mp4}
class SawTooth extends Curve {
/// Creates a sawtooth curve.
///
......@@ -90,7 +90,7 @@ class SawTooth extends Curve {
/// set to 1.0 will essentially become a three-second animation that starts
/// three seconds later.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_interval.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_interval.mp4}
class Interval extends Curve {
/// Creates an interval curve.
///
......@@ -139,7 +139,7 @@ class Interval extends Curve {
/// A curve that is 0.0 until it hits the threshold, then it jumps to 1.0.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_threshold.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_threshold.mp4}
class Threshold extends Curve {
/// Creates a threshold curve.
///
......@@ -171,10 +171,10 @@ class Threshold extends Curve {
/// * [Curves.easeOut]
/// * [Curves.easeInOut]
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_out.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in_out.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_out.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in_out.mp4}
///
/// The [Cubic] class implements third-order Bézier curves.
class Cubic extends Curve {
......@@ -253,8 +253,8 @@ class Cubic extends Curve {
///
/// This is the class used to implement the [flipped] getter on curves.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_flipped_curve.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_flipped_curve.mp4}
class FlippedCurve extends Curve {
/// Creates a flipped curve.
///
......@@ -361,7 +361,7 @@ class _BounceInOutCurve extends Curve {
/// An instance of this class using the default period of 0.4 is available as
/// [Curves.elasticIn].
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in.mp4}
class ElasticInCurve extends Curve {
/// Creates an elastic-in curve.
///
......@@ -390,7 +390,7 @@ class ElasticInCurve extends Curve {
/// An instance of this class using the default period of 0.4 is available as
/// [Curves.elasticOut].
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_out.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_out.mp4}
class ElasticOutCurve extends Curve {
/// Creates an elastic-out curve.
///
......@@ -419,7 +419,7 @@ class ElasticOutCurve extends Curve {
/// An instance of this class using the default period of 0.4 is available as
/// [Curves.elasticInOut].
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in_out.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in_out.mp4}
class ElasticInOutCurve extends Curve {
/// Creates an elastic-in-out curve.
///
......@@ -451,19 +451,19 @@ class ElasticInOutCurve extends Curve {
/// A collection of common animation curves.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in_out.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_out.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_decelerate.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in_out.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_out.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in_out.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_out.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_fast_out_slow_in.png)
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_linear.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in_out.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_out.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_decelerate.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in_out.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_out.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in_out.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_out.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_fast_out_slow_in.mp4}
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_linear.mp4}
///
/// See also:
///
......@@ -478,7 +478,7 @@ class Curves {
/// method returns its input unmodified. This is useful as a default curve for
/// cases where a [Curve] is required but no actual curve is desired.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_linear.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_linear.mp4}
static const Curve linear = const _Linear._();
/// A curve where the rate of change starts out quickly and then decelerates; an
......@@ -487,27 +487,27 @@ class Curves {
/// This is equivalent to the Android `DecelerateInterpolator` class with a unit
/// factor (the default factor).
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_decelerate.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_decelerate.mp4}
static const Curve decelerate = const _DecelerateCurve._();
/// A cubic animation curve that speeds up quickly and ends slowly.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease.mp4}
static const Cubic ease = const Cubic(0.25, 0.1, 0.25, 1.0);
/// A cubic animation curve that starts slowly and ends quickly.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in.mp4}
static const Cubic easeIn = const Cubic(0.42, 0.0, 1.0, 1.0);
/// A cubic animation curve that starts quickly and ends slowly.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_out.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_out.mp4}
static const Cubic easeOut = const Cubic(0.0, 0.0, 0.58, 1.0);
/// A cubic animation curve that starts slowly, speeds up, and then and ends slowly.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in_out.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_ease_in_out.mp4}
static const Cubic easeInOut = const Cubic(0.42, 0.0, 0.58, 1.0);
/// A curve that starts quickly and eases into its final position.
......@@ -516,36 +516,36 @@ class Curves {
/// final destination. As a result, the user isn’t left waiting for the
/// animation to finish, and the negative effects of motion are minimized.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_fast_out_slow_in.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_fast_out_slow_in.mp4}
static const Cubic fastOutSlowIn = const Cubic(0.4, 0.0, 0.2, 1.0);
/// An oscillating curve that grows in magnitude.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in.mp4}
static const Curve bounceIn = const _BounceInCurve._();
/// An oscillating curve that first grows and then shrink in magnitude.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_out.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_out.mp4}
static const Curve bounceOut = const _BounceOutCurve._();
/// An oscillating curve that first grows and then shrink in magnitude.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in_out.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_bounce_in_out.mp4}
static const Curve bounceInOut = const _BounceInOutCurve._();
/// An oscillating curve that grows in magnitude while overshooting its bounds.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in.mp4}
static const ElasticInCurve elasticIn = const ElasticInCurve();
/// An oscillating curve that shrinks in magnitude while overshooting its bounds.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_out.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_out.mp4}
static const ElasticOutCurve elasticOut = const ElasticOutCurve();
/// An oscillating curve that grows and then shrinks in magnitude while overshooting its bounds.
///
/// ![](https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in_out.png)
/// {@animation 464 192 https://flutter.github.io/assets-for-api-docs/assets/animation/curve_elastic_in_out.mp4}
static const ElasticInOutCurve elasticInOut = const ElasticInOutCurve();
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

HIAST - GitLab