反应原生 Android 褪色 animation 循环闪烁

Question

在 React Native 0.61 中，我有一个脉冲 animation 正在发生。 它在 iOS 上正常工作，但在 Android 上不能正常工作。

这是代码：

 state = { fadeAnim: new Animated.Value(1), springValue: new Animated.Value(0), }; runPulseAnimation() { Animated.loop( Animated.parallel([ Animated.timing(this.state.springValue, { toValue: 1, friction: 3, tension: 40, duration: 1500, }), Animated.timing(this.state.fadeAnim, { toValue: 0, duration: 1500, }), ]), ).start(); }

循环正常发生，但是在 Android 上，在 animation 结束后，不透明度在 spring 值重置之前切换回 1。 同样，这不会发生在 iOS 上。

有人遇到这样的事情吗？

Answer 1

在您的情况下，默认值似乎没有被初始化。 如果您尝试做的是重复性任务，您想试试这个吗？

      runPulseAnimation() {
        this.state.fadeAnim.setValue(1)
        this.state.springValue.setValue(0)

      Animated.parallel([
        Animated.timing(this.state.springValue, {
          toValue: 1,
          friction: 3,
          tension: 40,
          duration: 1500,
        }),
        Animated.timing(this.state.fadeAnim, {
          toValue: 0,
          duration: 1500,
        }),
      ]).start(() => this.runPulseAnimation());
      }

Answer 2

终于解决了。 不是从 1 开始，然后淡入到 0，因为我的视图的开头隐藏在另一个不透明度为 1 的视图后面，我能够对动画进行排序，淡入淡出，并在 1 处开始淡入淡出。

 state = { fadeAnim: new Animated.Value(0), springValue: new Animated.Value(0), };

 let fadeInAndOut = Animated.sequence([ Animated.timing(this.state.fadeAnim, { toValue: 1, duration: 750, }), Animated.timing(this.state.fadeAnim, { toValue: 0, duration: 750, }), ]); Animated.loop( Animated.parallel([ fadeInAndOut, Animated.timing(this.state.springValue, { toValue: 1, friction: 3, tension: 40, duration: 1500, }), ]), ).start();