Looping Lottie Animations Only Once

LOCKED: General
1

I was wondering how I can run a Lottie animation only once since it is looping by default.
Here is a link to the code I am trying to modify: https://docs.expo.io/versions/latest/sdk/lottie.html

Thanks.

2

Hey @airomo123,

Iā€™m a bit confused. The animation does only play once in the Lottie example. :thinking:

Adam

3

I use

  startLottieAnim(anim) {
    this.lottieAnim = anim;
    if (anim) {
      this.lottieAnim.play();
    }
  }

 <Lottie
    ref={c => this.startLottieAnim(c)}              
    style={{
      width: 400 - 100,
      height: 800 - 100
     }}
    source={require('../../../assets/superjump05_json.json')}  // eslint-disable-line
 />

and the animation is also looping.

1 Like
4

Hey @gregt,

It looks like there is a loop prop on the Lottie API http://airbnb.io/lottie/react-native/props.html so just set that to false.

Cheers,

Adam

2 Likes
5

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.