Jetpack Compose provides powerful animation APIs. I made some loading animations using them.
1. Loading Dialog:
This is a loading dialog box. You can display it while executing a background task. Its state is handled by the ViewModel.
Source Code: Loading Dialog
2. Circle Animation:
It is a circle made with the Box. Its scale value is animated using infinite transition API.
Source Code: Circle Animation
3. Gradient Circle:
It is a rotating gradient circle. It is similar to the loading spinner on Instagram.
Source Code: Gradient Circle
4. Dots Animation:
There are 3 dots. Their alpha values get animated one after the other.
Source Code: Dots Animation
5. Ripple Animation:
This is an infinite ripple animation. There are 3 circles whose scale values are increased from 0f to 1f.
Source Code: Ripple Animation
Bonus: Lottie Animations
We can add awesome Lottie animations in Jetpack Compose. Follow this article for more information.
These are the loading animations I made with Jetpack Compose. I hope you like them. If you have any doubts, comment below.