重复与InteractionManager.runafter Interactions的动画冲突

Question

反应本地重复动画

我搜索了如何实现重复的动画，我找到了这个。

//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.Runafter Interactions发生冲突，而runaftertractions通常用于在动画后做某事。

我可以使用settimeout等，依此类推，但是我想问，是否有更好的解决方案重复动画，或者避免这种冲突？

Answer 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();
    }
  });
}