UNPKG

3 kBTypeScriptView Raw
1import { View } from '../core/view';
2import { CoreTypes } from '../../core-types';
3import { Color } from '../../color';
4
5export declare const ANIMATION_PROPERTIES;
6
7interface Keyframe {
8 backgroundColor?: Color;
9 scale?: { x: number; y: number };
10 translate?: { x: number; y: number };
11 rotate?: { x: number; y: number; z: number };
12 opacity?: number;
13 width?: CoreTypes.PercentLengthType;
14 height?: CoreTypes.PercentLengthType;
15 valueSource?: 'keyframe' | 'animation';
16 duration?: number;
17 curve?: any;
18 forceLayer?: boolean;
19}
20
21export interface Keyframes {
22 name: string;
23 keyframes: Array<UnparsedKeyframe>;
24 tag?: string | number;
25 scopedTag?: string;
26 mediaQueryString?: string;
27}
28
29export interface UnparsedKeyframe {
30 values: Array<any>;
31 declarations: Array<KeyframeDeclaration>;
32}
33
34export interface KeyframeDeclaration {
35 property: string;
36 value: any;
37}
38
39export interface KeyframeInfo {
40 duration: number;
41 declarations: Array<KeyframeDeclaration>;
42 curve?: any;
43}
44
45/**
46 * Defines animation options for the View.animate method.
47 */
48export class KeyframeAnimationInfo {
49 /**
50 * Return animation keyframes.
51 */
52 keyframes: Array<KeyframeInfo>;
53
54 /**
55 * The animation name.
56 */
57 name?: string;
58
59 /**
60 * The length of the animation in milliseconds. The default duration is 300 milliseconds.
61 */
62 duration?: number;
63
64 /**
65 * The amount of time, in milliseconds, to delay starting the animation.
66 */
67 delay?: number;
68
69 /**
70 * Specifies how many times the animation should be played. Default is 1.
71 * iOS animations support fractional iterations, i.e. 1.5.
72 * To repeat an animation infinitely, use Number.POSITIVE_INFINITY
73 */
74 iterations?: number;
75
76 /**
77 * An optional animation curve. Possible values are contained in the [AnimationCurve enumeration](../modules/_ui_enums_.animationcurve.html).
78 * Alternatively, you can pass an instance of type UIViewAnimationCurve for iOS or android.animation.TimeInterpolator for Android.
79 */
80 curve?: any;
81
82 /**
83 * Determines whether the animation values will be applied on the animated object after the animation finishes.
84 */
85 isForwards: boolean;
86
87 /**
88 * If true the animation will be played backwards.
89 */
90 isReverse?: boolean;
91}
92
93export class KeyframeAnimation {
94 animations: Array<Keyframe>;
95
96 /**
97 * The amount of time, in milliseconds, to delay starting the animation.
98 */
99 delay: number;
100
101 /**
102 * Specifies how many times the animation should be played. Default is 1.
103 * iOS animations support fractional iterations, i.e. 1.5.
104 * To repeat an animation infinitely, use Number.POSITIVE_INFINITY
105 */
106 iterations: number;
107
108 /**
109 * Returns true if the application is currently running.
110 */
111 isPlaying: boolean;
112
113 /**
114 * Plays the animation.
115 */
116 public play: (view: View) => Promise<void>;
117
118 /**
119 * Cancels a playing animation.
120 */
121 public cancel: () => void;
122
123 /**
124 * Creates a keyframe animation from animation definition.
125 */
126 public static keyframeAnimationFromInfo(info: KeyframeAnimationInfo): KeyframeAnimation;
127}