我搜索了如何实现重复动画,我找到了这个。
//this.state.animatedStartValue = 0;
function cycleAnimation() {
Animated.sequence([
Animated.timing(this.state.animatedStartValue, {
toValue: 1,
duration: 500,
delay: 1000
}),
Animated.timing(this.state.animatedStartValue, {
toValue: 0,
duration: 500
})
]).start(event => {
if (event.finished) {
cycleAnimation();
}
});
}

它确实有效,但是当我在我的项目中使用它时,我发现这个解决方案会与InteractionManager.runAfterInteractions冲突,后者通常用于在动画之后做一些事情。
我可以使用setTimeOut等来避免这种情况,但我想问一下,有没有更好的解决方案来重复动画,或者避免这种冲突?
答案 0 :(得分:1)
使用param {isInteraction:false}可以避免这个问题。
//this.state.animatedStartValue = 0;
function cycleAnimation() {
Animated.sequence([
Animated.timing(this.state.animatedStartValue, {
toValue: 1,
duration: 500,
delay: 1000,
isInteraction: false,
}),
Animated.timing(this.state.animatedStartValue, {
toValue: 0,
duration: 500
})
]).start(event => {
if (event.finished) {
cycleAnimation();
}
});
}