How can you start an animation from an event?

I did find a workaround:

  1. Download the Lottie animation as a GIF.
  2. Upload the GIF to the Thunkable project.
  3. Add an Image component to the project and (optionally) a button.
  4. Use this code to show the animation when a button is clicked (or choose a different event type) and to hide it after the animation is completed:

The wait block duration depends on the GIF duration. There doesn’t seem to be an indication of the duration on the Lottie website. But I downloaded the GIF and opened it to find out that it had 58 frames. Assuming 30 frames per second (fps), that works out to 58/30 = 1.93 seconds. But I don’t know if every Lottie is 30 fps so it might be best to just use trial and error to see if the wait is long enough to display the entire animation once.

Edit: this works great the first time I click the button but after that it’s unpredictable.

Edit #2: Fixed:

4 Likes