Animated.stagger
和parallel
类似,也是使一组动画同时运行。但是,稍有一点不同的是这些动画之间开始时间依次会有一定的延迟。
this._opacityAnimationValue = new Animated.Value(1);
this._moveAnimationValue = new Animated.ValueXY();
Animated.stagger(100, [
Animated.timing(this._moveAnimationValue, {
toValue: 100,
duration: 500
}),
Animated.timing(this._opacityAnimationValue, {
toValue: 0,
duration: 200
})
]).start()
<Animated.View style={{opacity: this._opacityAnimationValue, transform: this._moveAnimationValue.getTranslateTransform()}} />
首先开始位移动画,在一定的延迟(约100毫秒)之后开始透明度动画。