Tzvetlin Velev
Tzvetlin Velev

Reputation: 2027

React-Native animation has a small pause

 animate() {
    Animated.loop(
      Animated.timing(this.spinValue, {
        toValue: 360,
        duration: 1000
      })
    ).start();
  }

I call this function in componentDidMount and its clearly looping the animation however, on every loop there is a slight delay before it starts. Trying to figure out how that can just become a smooth 0 -> 360 loop

Upvotes: 1

Views: 458

Answers (1)

Tzvetlin Velev
Tzvetlin Velev

Reputation: 2027

Adding Easing.linear was the solution.

 animate() {
    Animated.loop(
      Animated.timing(this.spinValue, {
        fromValue:0,
        toValue: 360,
        duration: 1000,
        easing: Easing.linear,
        useNativeDriver: true
      }),
      {useNativeDriver: true}
    ).start();
  }

Upvotes: 1

Related Questions