1 | import type { EasingFunction } from './commonTypes';
|
2 | /**
|
3 | * The `Easing` module implements common easing functions. This module is used
|
4 | * by [Animate.timing()](docs/animate.html#timing) to convey physically
|
5 | * believable motion in animations.
|
6 | *
|
7 | * You can find a visualization of some common easing functions at
|
8 | * http://easings.net/
|
9 | *
|
10 | * ### Predefined animations
|
11 | *
|
12 | * The `Easing` module provides several predefined animations through the
|
13 | * following methods:
|
14 | *
|
15 | * - [`back`](docs/easing.html#back) provides a simple animation where the object
|
16 | * goes slightly back before moving forward
|
17 | * - [`bounce`](docs/easing.html#bounce) provides a bouncing animation
|
18 | * - [`ease`](docs/easing.html#ease) provides a simple inertial animation
|
19 | * - [`elastic`](docs/easing.html#elastic) provides a simple spring interaction
|
20 | *
|
21 | * ### Standard functions
|
22 | *
|
23 | * Three standard easing functions are provided:
|
24 | *
|
25 | * - [`linear`](docs/easing.html#linear)
|
26 | * - [`quad`](docs/easing.html#quad)
|
27 | * - [`cubic`](docs/easing.html#cubic)
|
28 | *
|
29 | * The [`poly`](docs/easing.html#poly) function can be used to implement
|
30 | * quartic, quintic, and other higher power functions.
|
31 | *
|
32 | * ### Additional functions
|
33 | *
|
34 | * Additional mathematical functions are provided by the following methods:
|
35 | *
|
36 | * - [`bezier`](docs/easing.html#bezier) provides a cubic bezier curve
|
37 | * - [`circle`](docs/easing.html#circle) provides a circular function
|
38 | * - [`sin`](docs/easing.html#sin) provides a sinusoidal function
|
39 | * - [`exp`](docs/easing.html#exp) provides an exponential function
|
40 | *
|
41 | * The following helpers are used to modify other easing functions.
|
42 | *
|
43 | * - [`in`](docs/easing.html#in) runs an easing function forwards
|
44 | * - [`inOut`](docs/easing.html#inout) makes any easing function symmetrical
|
45 | * - [`out`](docs/easing.html#out) runs an easing function backwards
|
46 | */
|
47 | /** @deprecated Please use {@link EasingFunction} type instead. */
|
48 | export type EasingFn = EasingFunction;
|
49 | export type EasingFunctionFactory = {
|
50 | factory: () => EasingFunction;
|
51 | };
|
52 | /** @deprecated Please use {@link EasingFunctionFactory} type instead. */
|
53 | export type EasingFactoryFn = EasingFunctionFactory;
|
54 | /**
|
55 | * A linear function, `f(t) = t`. Position correlates to elapsed time one to
|
56 | * one.
|
57 | *
|
58 | * http://cubic-bezier.com/#0,0,1,1
|
59 | */
|
60 | declare function linear(t: number): number;
|
61 | /**
|
62 | * A simple inertial interaction, similar to an object slowly accelerating to
|
63 | * speed.
|
64 | *
|
65 | * http://cubic-bezier.com/#.42,0,1,1
|
66 | */
|
67 | declare function ease(t: number): number;
|
68 | /**
|
69 | * A quadratic function, `f(t) = t * t`. Position equals the square of elapsed
|
70 | * time.
|
71 | *
|
72 | * http://easings.net/#easeInQuad
|
73 | */
|
74 | declare function quad(t: number): number;
|
75 | /**
|
76 | * A cubic function, `f(t) = t * t * t`. Position equals the cube of elapsed
|
77 | * time.
|
78 | *
|
79 | * http://easings.net/#easeInCubic
|
80 | */
|
81 | declare function cubic(t: number): number;
|
82 | /**
|
83 | * A power function. Position is equal to the Nth power of elapsed time.
|
84 | *
|
85 | * N = 4: http://easings.net/#easeInQuart n = 5: http://easings.net/#easeInQuint
|
86 | */
|
87 | declare function poly(n: number): EasingFunction;
|
88 | /**
|
89 | * A sinusoidal function.
|
90 | *
|
91 | * http://easings.net/#easeInSine
|
92 | */
|
93 | declare function sin(t: number): number;
|
94 | /**
|
95 | * A circular function.
|
96 | *
|
97 | * http://easings.net/#easeInCirc
|
98 | */
|
99 | declare function circle(t: number): number;
|
100 | /**
|
101 | * An exponential function.
|
102 | *
|
103 | * http://easings.net/#easeInExpo
|
104 | */
|
105 | declare function exp(t: number): number;
|
106 | /**
|
107 | * A simple elastic interaction, similar to a spring oscillating back and forth.
|
108 | *
|
109 | * Default bounciness is 1, which overshoots a little bit once. 0 bounciness
|
110 | * doesn't overshoot at all, and bounciness of N `>` 1 will overshoot about N
|
111 | * times.
|
112 | *
|
113 | * http://easings.net/#easeInElastic
|
114 | */
|
115 | declare function elastic(bounciness?: number): EasingFunction;
|
116 | /**
|
117 | * Use with `Animated.parallel()` to create a simple effect where the object
|
118 | * animates back slightly as the animation starts.
|
119 | *
|
120 | * Wolfram Plot:
|
121 | *
|
122 | * - http://tiny.cc/back_default (s = 1.70158, default)
|
123 | */
|
124 | declare function back(s?: number): (t: number) => number;
|
125 | /**
|
126 | * Provides a simple bouncing effect.
|
127 | *
|
128 | * http://easings.net/#easeInBounce
|
129 | */
|
130 | declare function bounce(t: number): number;
|
131 | /**
|
132 | * Provides a cubic bezier curve, equivalent to CSS Transitions'
|
133 | * `transition-timing-function`.
|
134 | *
|
135 | * A useful tool to visualize cubic bezier curves can be found at
|
136 | * http://cubic-bezier.com/
|
137 | */
|
138 | declare function bezier(x1: number, y1: number, x2: number, y2: number): {
|
139 | factory: () => (x: number) => number;
|
140 | };
|
141 | declare function bezierFn(x1: number, y1: number, x2: number, y2: number): (x: number) => number;
|
142 | /** Runs an easing function forwards. */
|
143 | declare function in_(easing: EasingFunction): EasingFunction;
|
144 | /** Runs an easing function backwards. */
|
145 | declare function out(easing: EasingFunction): EasingFunction;
|
146 | /**
|
147 | * Makes any easing function symmetrical. The easing function will run forwards
|
148 | * for half of the duration, then backwards for the rest of the duration.
|
149 | */
|
150 | declare function inOut(easing: EasingFunction): EasingFunction;
|
151 | /**
|
152 | * The `steps` easing function jumps between discrete values at regular
|
153 | * intervals, creating a stepped animation effect. The `n` parameter determines
|
154 | * the number of steps in the animation, and the `roundToNextStep` parameter
|
155 | * determines whether the animation should start at the beginning or end of each
|
156 | * step.
|
157 | */
|
158 | declare function steps(n?: number, roundToNextStep?: boolean): EasingFunction;
|
159 | export declare const EasingNameSymbol: unique symbol;
|
160 | export declare const Easing: {
|
161 | linear: typeof linear;
|
162 | ease: typeof ease;
|
163 | quad: typeof quad;
|
164 | cubic: typeof cubic;
|
165 | poly: typeof poly;
|
166 | sin: typeof sin;
|
167 | circle: typeof circle;
|
168 | exp: typeof exp;
|
169 | elastic: typeof elastic;
|
170 | back: typeof back;
|
171 | bounce: typeof bounce;
|
172 | bezier: typeof bezier;
|
173 | bezierFn: typeof bezierFn;
|
174 | steps: typeof steps;
|
175 | in: typeof in_;
|
176 | out: typeof out;
|
177 | inOut: typeof inOut;
|
178 | };
|
179 | export {};
|
180 | //# sourceMappingURL=Easing.d.ts.map |
\ | No newline at end of file |