Se siente refrescante biblioteca de animación Lottie

¡Poco conocimiento, gran desafío! Este artículo participa en la creación de " Conocimiento esencial de los programadores "

Este artículo ha participado en  el "Programa Estrella de Explotación"  para ganar paquetes de regalos creativos y desafiar incentivos creativos.

Hace unos días, el cliente pensó que la animación de carga de nuestro proyecto no se veía muy bien y quería cambiarla. En ese momento, perdí los estribos, ay, el cliente es el maestro. Aclaremos, de todos modos, es un GIF si es dictado. Para hacer una interfaz de usuario, me presenté directamente al trabajo durante 2 días, lo que indica que si el diseño no es perfecto, dificultará mucho nuestro rendimiento. Jeje, en realidad quiero pescar.

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

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

Enlace

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

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

Instrucciones

Github

Primero, necesitas importar las dependencias correspondientes en Github.Por cierto, la última versión ahora es 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()

    }
}

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

establecido en 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 是否循环

Efecto

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

oficial de lottie