After Effects Animations disappear at the end

[thecynicalpaul]

As per title: whenever a JSON animation created from After Effects is played with autoPlay=true and loop=false, the entire animation disappears once completed. This does not happen in lottie-react-native.

What I've tried:

• Adding extra frames at the end
• dotLottie files (these don't work in rn-skottie as of today)

[hannojg]

Are you able to share your Lottie animation? That doesn't happen in the example app (so we need some kind of reproduction). If I have to guess I'd assume your first frame of the animation might be blank?

[thecynicalpaul]

@hannojg You are correct, the animation is a scale type of fade in.

And sure, here's an example: This contains .json and .lottie files. legend.zip

Slightly off-topic, but weirdly, this .lottie works, the only difference is how it's generated - The non-working .lottie files are made through Lottie AE extension export directly to Lottie website platform, and then exporting it as an unoptimized .lottie. The working one is done by first exporting the .json and then using https://lottiefiles.com/tools/lottie-to-dotlottie

[thecynicalpaul]

Slight update on debugging this: added a big fat circle on all frames of the animation, eliminating the blank frames; the issue persists, the whole thing disappears at the end.

Another notable observation: as a temporary hack, I use a setTimeout to pause just before it ends (about 100ms) and this works about 90% of the time, but sometimes it still clears everything.

[hannojg]

Hey, could you provide the debugging animation as well? thanks!

[thecynicalpaul]

Sorry for the delay, here it is. badges-Circle-lv1.json