如何在Java程序中以编程方式添加Lottie动画

3

我尝试通过Java(Android)编程的方式添加Lottie动画,但是一直失败。我将在下面展示我的代码,我需要从drawable更改为Lottie。

这是drawable的代码:

if (status.equals("connect")) {

            vpnBtn.setBackgroundResource(R.drawable.but_connect_light);
            logTv.setTextColor(getResources().getColor(R.color.font_color));

        } else if (status.equals("connecting")) {

            vpnBtn.setBackgroundResource(R.drawable.but_connecting_dark);
            logTv.setTextColor(getResources().getColor(R.color.font_color));

        } else if (status.equals("connected")) {

            vpnBtn.setBackgroundResource(R.drawable.but_disconnect_dark);
            logTv.setTextColor(getResources().getColor(R.color.purple));

        } else if (status.equals("failed")) {

            vpnBtn.setBackgroundResource(R.drawable.but_connect_dark);

        }

这是上面相关的XML文件

<ImageView
        android:id="@+id/vpnBtn"
        android:layout_alignParentBottom="true"
        android:layout_gravity="center_horizontal"
        android:tag="1"
        android:layout_width="140dp"
        android:layout_height="140dp"
        android:background="@drawable/but_connect_light"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="50dp"/>

你到底尝试了什么?据我所知,Lottie文件应该从资源中包含(或通过HTTP请求动态下载),然后加载到LottieImageView或类似的组件中。他们的文档比我更清楚,我建议你阅读一下。 - Some random IT boy
我真的不知道该怎么做,我只是尝试了setAnimation(R.raw..json),但我知道这是错误的,并且会抛出错误。 - Infinite Support
请将您尝试过的所有操作和出现的错误信息发布出来,以便我们能够进一步帮助您。我记得当我刚开始使用它时,这是一个相当简单的任务,所以我很惊讶您遇到了困难。这是一个逐步指南。另外,了解您正在尝试在哪个Android操作系统版本上运行,可能(仅仅可能)是不兼容的,这也会很有帮助。还有一件值得注意的事情是,请告诉我们您是使用androidx还是旧的Android库。谢谢! - Some random IT boy
我会在这里发布代码和错误,我是一个初学者,所以任务很简单,但是我遇到了错误。 - Infinite Support
没问题,但我们需要查看错误的堆栈跟踪。 - Some random IT boy
根据您的要求,这是显示错误的过程:com.infinite.vpn,PID:10451 java.lang.IllegalStateException:在加载图像之前,您必须设置一个图像文件夹。请使用LottieComposition#setImagesFolder或LottieDrawable#setImagesFolder进行设置。 - Infinite Support
4个回答

5

以上的解决方案对我没有用,导致应用程序崩溃。

尝试使用这个:

animationView.setAnimation(R.raw.your_lottie_file)

或者,将其添加到 Infinite 的 答案

String vpnsBtn;

if (check.equals("night")){

    switch (status) {
        case "connect":

            vpnBtn.setVisibility(View.VISIBLE);
            vpnsBtn = R.raw.disconnected;
            logTv.setTextColor(getResources().getColor(R.color.font_color));

            break;
        case "connecting":

            vpnBtn.setVisibility(View.VISIBLE);
            vpnsBtn = R.raw.connectingg;
            logTv.setTextColor(getResources().getColor(R.color.font_color));

            break;
        case "connected":

            vpnBtn.setVisibility(View.VISIBLE);
            vpnsBtn = R.raw.connected
            logTv.setTextColor(getResources().getColor(R.color.purple));

            break;
        case "failed":

            vpnBtn.setVisibility(View.VISIBLE);
            vpnsBtn = R.raw.disconnected;

            break;
    }

}else {

    switch (status) {
        case "connect":

            vpnBtn.setVisibility(View.VISIBLE);
            vpnsBtn = R.raw.disconnected;
            logTv.setTextColor(getResources().getColor(R.color.font_color));

            break;
        case "connecting":

            vpnBtn.setVisibility(View.VISIBLE);
            vpnsBtn = R.raw.connectingg;;
            logTv.setTextColor(getResources().getColor(R.color.font_color));

            break;
        case "connected":

            vpnBtn.setVisibility(View.VISIBLE);
            vpnsBtn = R.raw.connected;;
            logTv.setTextColor(getResources().getColor(R.color.purple));

            break;
        case "failed":

            vpnBtn.setVisibility(View.VISIBLE);
            vpnsBtn = R.raw.disconnected;

            break;
    }
}

LottieAnimationView animationView = findViewById(R.id.vpnBtn);
animationView.setImageAssetsFolder("vpnconnect");
animationView.setAnimation(vpnsBtn);
animationView.loop(true);
animationView.playAnimation();

3

首先使用这个依赖项

implementation 'com.airbnb.android:lottie:3.6.1'

在xml中添加LottieAnimationView
 <com.airbnb.lottie.LottieAnimationView       
        android:id="@+id/animation"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerInParent="true"
        android:layout_gravity="center"
        app:lottie_autoPlay="true"
        app:lottie_fileName="loading.json"
        app:lottie_loop="true"
        app:lottie_speed="1" />

根据您的使用情况更改动画:

animation.setAnimation("loading.json");

注意: 将您的Lottie动画JSON文件添加到资产文件夹中。


2
我用以下解决方案实现了这个:
String vpnsBtn;

if (check.equals("night")){

        switch (status) {
            case "connect":

                vpnBtn.setVisibility(View.VISIBLE);
                vpnsBtn = ("disconnected.json");
                logTv.setTextColor(getResources().getColor(R.color.font_color));

                break;
            case "connecting":

                vpnBtn.setVisibility(View.VISIBLE);
                vpnsBtn = ("connectingg.json");
                logTv.setTextColor(getResources().getColor(R.color.font_color));

                break;
            case "connected":

                vpnBtn.setVisibility(View.VISIBLE);
                vpnsBtn = ("connected.json");
                logTv.setTextColor(getResources().getColor(R.color.purple));

                break;
            case "failed":

                vpnBtn.setVisibility(View.VISIBLE);
                vpnsBtn = ("disconnected.json");

                break;
        }

    }else {

        switch (status) {
            case "connect":

                vpnBtn.setVisibility(View.VISIBLE);
                vpnsBtn = ("disconnected.json");
                logTv.setTextColor(getResources().getColor(R.color.font_color));

                break;
            case "connecting":

                vpnBtn.setVisibility(View.VISIBLE);
                vpnsBtn = ("connectingg.json");
                logTv.setTextColor(getResources().getColor(R.color.font_color));

                break;
            case "connected":

                vpnBtn.setVisibility(View.VISIBLE);
                vpnsBtn = ("connected.json");
                logTv.setTextColor(getResources().getColor(R.color.purple));

                break;
            case "failed":

                vpnBtn.setVisibility(View.VISIBLE);
                vpnsBtn = ("disconnected.json");

                break;
        }
    }

    LottieAnimationView animationView = findViewById(R.id.vpnBtn);
    animationView.setImageAssetsFolder("vpnconnect");
    animationView.setAnimation(vpnsBtn);
    animationView.loop(true);
    animationView.playAnimation();

我希望这篇文章能够帮助其他想在Android上使用Lottie动画按钮的人。


1

为了使用Lottie,我需要进行以下操作:

build.gradle(:app)中添加以下内容并同步:

implementation 'com.airbnb.android:lottie:$lottieVersion'

然后,添加assets文件夹。然后,在其中添加JSON文件。接着,进入activity_main.xml文件,添加:

<com.airbnb.lottie.LottieAnimationView
            android:id="@+id/lav_actionBar"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:layout_marginStart="0dp"
            android:layout_marginTop="0dp"
            android:layout_marginEnd="0dp"
            android:scaleType="centerCrop"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:lottie_autoPlay="true"
            app:lottie_fileName="circle-load.json" --> add your JSON file name 
            app:lottie_loop="true" />

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接