小知识，大挑战！本文正在参与「程序员必备小知识」创作活动

本文已参与「掘力星计划」，赢取创作大礼包，挑战创作激励金。

前几天客户觉得我们项目加载动画不太好看,想要换一个,我当时就....没了脾气,唉,客户就是爷.开整吧,反正撑死就是个GIF,如果是口述就让UI做一个,我直接报工2天,表示这个如果设计的不够完美对我们的性能有十分大的阻碍.嘿嘿,实际上是想摸鱼.

后面客户果不其然发了一个动态图

loading加载.gif

你还别说,真挺好看,比我们默认的菊花好看多了,当我快乐的应用上去时发现他有一块默认的白色背景,后面找客户再要一个没有白色背景的GIF时客户直接甩了一个网址

链接

进去之后发现是一个网站,里面超多炫酷的动图,我当时直接忘记客户的需求了,直接在炫酷动图的海洋里尽情遨游,哈哈哈哈哈

后面客户在群里疯狂艾特我才回过神来.

使用方法

Github

首先你要去Github上导入相应的依赖,对了,现在最新版本是4.2.0

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

导入完毕后直接在xml中声明就好啦!

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".lottie.LottieActivity">

    <com.airbnb.lottie.LottieAnimationView
        android:id="@+id/lottie"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        />

</androidx.constraintlayout.widget.ConstraintLayout>

然后我们就去网站下载我们心爱的加载图,将其放入我们的assets文件夹下

接下来就是在Activity中设置相应的属性了,不过在xml中也可以

class LottieActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
       setContentView(R.layout.activity_lottie)
        val inflate = findViewById<LottieAnimationView>(R.id.lottie);

        //设置资源文件,默认加载assets
        inflate.setAnimation("test.json")
        //设置动画重复次数
        inflate.repeatCount = ValueAnimator.INFINITE
        //开始
        inflate.playAnimation()

    }
}

哈哈哈哈哈,就这么一屁点代码

XML中设置

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".lottie.LottieActivity">

    <com.airbnb.lottie.LottieAnimationView
        android:id="@+id/lottie"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:lottie_loop="true"
        app:lottie_fileName="test.json"
        app:lottie_autoPlay="true"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        />

</androidx.constraintlayout.widget.ConstraintLayout>

lottie_autoPlay 表示是不是自动播放
lottie_fileName 文件名称
lottie_loop 是否循环

效果

使用超级简单,而且有很多人正在上传新的动画,更多官方的API大家移步下面的链接

Lottie官方

感觉让人耳目一新的动画库Lottie

使用方法

效果