Make animation appear while api data is loading

Hi, I have data that takes about 10 seconds to load (after a search is requested) and show the data in a repeating group. I would like to have an image (Lottie animation in an HTML element). show while the api data is loading and then making them image (lottie animation) disappear once the data is loaded.

1 Like

Hi there, @joptin… have you come across any of these videos on the subject of Lottie animations?

It also looks like there are two related plugins… have you seen them?


@mikeloc thanks for the help!! I have not seen those videos but my question mostly relates to only seeing the lottie animation after the user searches and while the data is loading and after having the lottie animation disappear when the data is loaded from the API. Do you know how I would do that?

Yup, I understood your question, and no, I don’t know how to do that specific thing (i.e., showing/hiding a Lottie animation) because I haven’t done it before. That being said, if you can use any of those resources to get the Lottie animation into your app, I’d be surprised if you aren’t able to use a condition or a workflow or a custom state or something to show the animation at the desired time.

OK, I’ll keep the thread updated once I figure it out. Thanks again for the help!

1 Like

Make an input which is disabled and not visible put their a few data which is returned back from the API call (do that in initial value not in the place holder)
Now in the work flow of the search bar have a work slow that if the search button is clicked show that animation and after that immediately put a another word flow where the animation should be hidden when that input initial value is not empty