In this article, LoadingButton is added in android. LoadingButton provides us an amazing UI and an animation whenever the user taps on it. It is very easy to add a LoadingButton in an app. It is very much similar to Button in android, just add the dependency and a few properties. Tags like BL_backgroundColor, BL_circleColor, BL_circleColorSecond, BL_stateShow and many more can be used to customize the Loading Button. Loading Button View is used wherever the developer wants the user to wait for some time. We can also use Progress Bar instead of this but Loading Button provides unique and attractive UI and increases the user experience. It also provides full control to Developer as it can be customized according to the requirements.
Approach:
Step 1: Add the support Library in your root build.gradle file (not your module build.gradle file). This library jitpack is a novel package repository. It is made for JVM so that any library which is present in github and bitbucket can be directly used in the application.
XML
Step 2: Add the support Library in build.gradle file and add dependency in the dependencies section.
XML
dependencies { //For Snackbar implementation 'com.google.android.material:material:1.1.0' //For LoadingButton implementation 'com.github.andreasagap:LoadingButtonLibrary:v1.0'} |
Step 3: Add the following code in activity_main.xml file. In this file we add our LoadingButton to the layout.
activity_main.xml
<androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent" android:id="@+id/root" android:layout_height="match_parent"> <andreasagap.loadingbutton.ButtonLoading android:id="@+id/loadingbutton" android:layout_width="200dp" android:layout_height="50dp" android:padding="6dp" app:BL_backgroundColor="#9c9b9999" app:BL_circleColor="#219806" app:BL_circleColorSecond="#126300" app:BL_enable="true" app:BL_stateShow="normal" app:BL_text="Buy Course" app:BL_textColor="#FFF" app:BL_textSize="16sp" android:textStyle="bold" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout> |
Step 4: Add the following code in the MainActivity.java file. In this file, attach Loading Button to the root layout then add a Listener to it. So whenever the user taps on it, setOnButtonLoadingListener gets invoked automatically. Inside the listener, three methods are present onClick(), onStart() and onFinish(). Inside the onClick method add the code that should be executed when the button is clicked, in onStart() method add the code that is to be executed immediately when the button is clicked and in onFinish() method add the code that is executed after the other two functions are executed.
MainActivity.java
package org.neveropen.loadingbutton import androidx.appcompat.app.AppCompatActivity;import androidx.constraintlayout.widget.ConstraintLayout;import android.os.Bundle;import android.widget.Toast;import com.google.android.material.snackbar.BaseTransientBottomBar;import com.google.android.material.snackbar.Snackbar;import andreasagap.loadingbutton.ButtonLoading; public class MainActivity extends AppCompatActivity { ButtonLoading loading_button; ConstraintLayout layout; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); layout = findViewById(R.id.root); loading_button =findViewById(R.id.loadingbutton); loading_button.setRoot(loading_button,this, layout); //set OnClickListener to button loading_button.setOnButtonLoadingListener( new ButtonLoading.OnButtonLoadingListener() { @Override public void onClick() { } @Override public void onStart() { Toast.makeText(MainActivity.this, "Loading Start", Toast.LENGTH_LONG).show(); } @Override public void onFinish() { //show snackbar when loading finished Snackbar.make(layout, "Thank you for buying our Course!", BaseTransientBottomBar .LENGTH_LONG) .show(); } }); } @Override public void onBackPressed() { loading_button.cancel(); }} |
Output:
Reference: https://github.com/andreasagap/LoadingButtonLibrary
