Progress Button using JetPack Compose : SSJetPackComposeProgressButton
SSJetPackComposeProgressButton is an elegant button with different loading animations which make your app attractive.
Almost everybody agrees that a great design helps a lot to make people get interested in your app. SSJetPackComposeProgressButton is an android GitHub library to create animated loading buttons suitable for API calls as well as other background processes where users have to wait. It’s based on the android declarative UI toolkit Jetpack Compose. It comes with a pre-built animation design that attracts users to wait while you call API or do some background process. Let’s see how you can eliminate your efforts by using this library…
Jetpack Compose
Jetpack Compose is Android’s modern toolkit for building native UI. It simplifies and accelerates UI development on Android. Quickly bring your app to life with less code, powerful tools, and intuitive Kotlin APIs.
How to get started
Please get Android Studio Arctic Fox 2020.3.1 or above from here and use JDK 11 to build this project.
Features
- Android’s modern toolkit — Jetpack Compose support.
- Newly designed loading animation makes your app attractive.
- Blinking icon button for your hot feature.
- Button with text, right and left icon.
- Different types of states make it easy to manage buttons. (Idle, Loading, Success, Failure)
- Fully customized button (Corner radius, background, colors, animation speed, etc.)
- Customized button loading animation with your logo and special animation effect.
Installation
- Add it in your root build.gradle at the end of repositories:
2. Add the dependency in your app’s build.gradle file:
Usage
- Just use SSJetPackComposeProgressButton where you want button:
2. On Success change submitButtonState to success state:
3. On Failure change submitButtonState to the failure state:
Customizations
It comes with a pre-built animation design while the button is in a loading state.
- CIRCLE
- WHEEL
- ZOOM_IN_OUT_CIRCLE
- CLOCK
- SPIRAL
However, you can customize the loading icon and animation effect according to your requirement. It is customizable with your app/brand icon and color. You can apply multiple animation effects from rotation, zoom-in-out, and color changer too.
Here are the code steps to customize the loading button:
And All Set…Your custom loading button is ready, really!!
Still, there are many attributes available using which you can easily customize the loading button in jetpack compose. Here is the list of attributes:
All Attributes
Conclusion
SSJetPackComposeProgressButton library provides a great variety of loading button animation in the modern android toolkit Jetpack compose. You can easily create a button in Jetpack Compose and integrate it with your background process like API call to change state according to API progress, success, and failure.
You can check out the fully working example on our GitHub Repository. If you are facing any bugs/issues or want any feature then feel free to create an issue on GitHub.
If this article and library helps you then please show some love by staring ⭐️ our library and giving a few claps 👏.
