Eric Jalal
Eric Jalal

Reputation: 540

How to use Lottie Animation inside a button instead of a circular progress bar

I want to put a tiny animation inside a button, this animation is in JSON format and has made with After Effect, and normally this type of animations can be compiled and used with the Lottie plugin, but now I want to put this animation inside of button instead of using a regular circular progress bar

Upvotes: 7

Views: 9038

Answers (2)

Shahzain ali
Shahzain ali

Reputation: 1725

For this you have to make a custom view which looks like same as button, and bind events to that view, set custom background using XML to View and include animation(airbnb lottie's library code in it). still not satisfied, then comment more specifically that what things you want to achieve using button that is impossible to achieve using above method.

Upvotes: 0

Pabel
Pabel

Reputation: 672

You have to use the LottieAnimation like a button.

    lt_loading_view = (LottieAnimationView) findViewById(R.id.lt_loading_view);
    lt_loading_view.setAnimation("loading.json");
    lt_loading_view.loop(true);
    lt_loading_view.playAnimation();
    lt_loading_view.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            //Your code
            lt_loading_view.pauseAnimation();
        }
    });

Use the background like a button

    <com.airbnb.lottie.LottieAnimationView
    android:id="@+id/lt_loading_view"
    android:layout_width="80dp"
    android:layout_height="80dp"
    android:background="@color/colorPrimary"
    android:layout_centerHorizontal="true"
    android:layout_alignParentBottom="true"/>

you can put the same background that you have in the button

Upvotes: -1

Related Questions