0

My current problem is that my animation is not activating for the correct id that was assigned:

    anim_star = (id) => {

  let progress = this.state.progress;
  progress[id] = new Animated.Value(0);

    this.setState({ progress });
console.log(this.state.progress);
  Animated.timing(this.state.progress, {
    toValue: 1,
    duration: 2000,
    easing: Easing.linear,
  }).start();

}

The console result of that is here:

enter image description here

Where you see the 10: AnimatedValue, the 10 represents the id that I clicked on for that animation. For some reason, the animation is not playing for 10.

Here is my attempt to try and (I guess) append the correct id to the AnimatedValue:

   <TouchableOpacity
         onPress={this.anim_like.bind(this, item.id)}>
          <Animation
          progress={this.state.progress[item.id]} // Here is where I think I need to fix.
          source={require('../Animations/favourite_app_icon.json')}

          />
          </TouchableOpacity>

Is there a way to mocked what I have going on in the console.log?

Laney Williams
  • 573
  • 3
  • 13
  • 34
  • What is 'Animation' component. You can only animate `View`, `Text`, `Image`, and `ScrollView` for other components you have to use `Animated.createAnimatedComponent()`. Check the react-native docs. First check if the animation is working without providing any id's then make it work with id's, this way you can debug the error. – Ravi Raj May 16 '18 at 07:51
  • @RaviRaj from Lottie – Laney Williams May 16 '18 at 09:54
  • @RaviRaj Also, Yes the animation works without id's, but without id's all animations play at the same time. – Laney Williams May 16 '18 at 11:53
  • Sorry, I cannot grasp your code. But try this change, in your `Animated.timing` line where animation starts, change `this.state.progress` to `this.state.progress[id]`. It may work. – Ravi Raj May 17 '18 at 08:19
  • @RaviRaj I get console log result of nothing when I add in the [id].What can I do to help you understand my code? – Laney Williams May 17 '18 at 11:31

0 Answers0