Liquid Pour Loading Animation Android Example

Today i am giving you a great animation tutorial for loading progress with liquid pour effect and in previous article you can learn to create your custom loading progress bar by using Road runner library. But here you'll teach another cool animation effect for your loading animation.
You can also check : Circular Fillable Loaders Android Library
Just look at the example below :

Cool animation for all project : Kick Out the Wrong Password Android Animation

In xml layout file

 <com.gospelware.liquidbutton.LiquidButton
       android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerInParent="true"
        android:clickable="true" />

Uses startPour() to start the animation.

LiquidButton liquidButton = (LiquidButton) findViewById(R.id.button);
      liquidButton.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View v) {
            LiquidButton btn = (LiquidButton) v;
            btn.startPour();
      }
      });

Set fillAfter using setFillAfter(), befault as not fill after

liquidButton.setFillAfter(true);

Set autoPlay using setAutoPlay(), default as not palying automatically

liquidButton.setAutoPlay(true);

Register PourFinishListener to the widget

It will send a callback onPourFinish() when the animation completed, and onProgressUpdate() when new progress is updated;
liquidButton.setPourFinishListener(new LiquidButton.PourFinishListener() {

           @Override
            public void onPourFinish() {
                  Toast.makeText(MainActivity.this, "Finish", Toast.LENGTH_SHORT).show();
            }

            @Override
            public void onProgressUpdate(float progress) {
                  textView.setText(String.format("%.2f", progress * 100) + "%");
            }          
      });

How to update and finish the animation?

You'll able to uses changeProgress() to alternate the progress of the liquid level. (You need AutoPlay turn Off to be able to do that.) Progress are measure in float, where 1f = 100%;
liquidButton.changeProgress(progress);
Note :
By default the widget starts a finish animation when the progress is 1f, but you can also uses finishPour to start the finish Animation.
liquidButton.finishPour();

How to?

Gradle
dependencies {    
            compile 'com.gospelware.liquidbutton:liquidButtonLib:1.1.4'
      }

Hope you like this tutorial. If it is then please give some time to share with your friends.

Comments