React Native动画,完成事件

Question

Animated.spring结束时触发事件的最佳做法是什么？

Animated.spring(this.state.pan, {
    toValue: 0
}).start()

我搜索了很多,没有找到一种方法来做到这一点.我可以使用addListener来检查动画是否达到了它的结束值或超时,但是他们都觉得丑陋的修复应该是超级简单的.

有人知道吗？

Answer 1

半小时的谷歌搜索后来我发现了这一点,不敢相信他们没有更好地记录这一点.

https://github.com/facebook/react-native/issues/3212

.start(callback)

Answer 2

这将在动画开始时触发

.start(console.log("Start Animation")

使用一个或多个箭头功能，在动画结束时将调用完成

.start(() => {console.log("Animation DONE")})

最后，这就是函数上下文中的样子。

_play(){
  Animated.timing(this.state.progress, {
     toValue: 1,
     duration: 5000,
     easing: Easing.linear,
   }).start(() => {console.log("Animation DONE")});
}

希望有帮助！