Best practice for loading animations

Hello dear Bubblers,

I would be highly interested in learning on how each and everyone of you implements loading animations on the entire screen or individual buttons as a best practice. Sometimes it seems tedious to have individual rotating items on each single button. Example:


How do you implement loading animations in your applications in a scalable manner so that it remains “editable” in as few locations as possible?


I usually create reusable popups and use Lottie files to show the loading animation. For instance, if I am fetching data from API, I run the workflow as followings;

When API is called > Show loading popup

Then when I receive the API data on my repeating group or another container I run the following to hide the popup;

When repeating group’s first item’s ID is not empty> Hide Loading popup


That is a great idea, thank you! Is there any secret tip with buttons? I know that it’s possible to work with show/hide or states, but this doesn’t seem like a good practice… :frowning:

If you are trying to show loading button for certain time (not meeting any workflow condition) you can try creating a reusable button showing loading for certain time may be for 5 Sec.

Lets see if somebody comes with better solution.

This topic was automatically closed after 70 days. New replies are no longer allowed.