This is used to run a set of animations one after the other. Once an animation is finished the next one is run. So as we see here we run first a color animation, then we scale. Our start
callback won't be run until they both finish, so in 800
milliseconds.
Animated.sequence([ Animated.timing(this.state.colorAnimation, { toValue: 1, duration: 500, }), Animated.timing(this.state.scaleAnimation, { toValue: 2, duration: 300, }), ]).start();
You can additionally animate the same animated values inside of sequences.
Animated.sequence([ Animated.timing(this.state.colorAnimation, { toValue: 1, duration: 500, }), Animated.timing(this.state.colorAnimation, { toValue: 0, duration: 500, }), Animated.timing(this.state.scaleAnimation, { toValue: 2, duration: 300, }), ]).start();