Lottie Android para Kotlin: guia completo com exemplos práticos

1. O que é e para que serve

Lottie é uma biblioteca de código aberto criada pela Airbnb que permite renderizar animações do After Effects em tempo real em dispositivos móveis e na web. Para Android, existe a biblioteca oficial com.airbnb.android:lottie, com suporte total à linguagem Kotlin. As animações são exportadas do After Effects para o formato JSON (através do plugin Bodymovin) e reproduzidas no aplicativo sem perda de qualidade e com tamanho de arquivo mínimo.

Para que serve a Lottie? Primeiro, ela simplifica drasticamente o trabalho de designers e desenvolvedores: o designer cria animações complexas em sua ferramenta habitual, e o desenvolvedor apenas conecta o arquivo JSON. Segundo, a Lottie oferece alto desempenho — as animações são renderizadas na GPU, garantindo 60 FPS mesmo em dispositivos mais antigos. Terceiro, a biblioteca suporta interatividade: você pode controlar a reprodução, alterar velocidade, cores, tamanhos e até animar camadas individualmente por código.

Lottie Android é ideal para: telas de carregamento (splash screens), ícones animados, transições entre telas, reações a gestos do usuário, microanimações na interface e muito mais. A biblioteca é ativamente mantida pela comunidade e possui milhares de animações gratuitas prontas no LottieFiles.

2. Instalação

Para instalar a Lottie em um projeto Android com Kotlin, adicione a dependência no arquivo build.gradle (nível do módulo):

dependencies {
    implementation 'com.airbnb.android:lottie:6.4.0'
}

Se você usa Kotlin DSL (build.gradle.kts):

dependencies {
    implementation("com.airbnb.android:lottie:6.4.0")
}

Após sincronizar o Gradle, a biblioteca está pronta para uso. A versão mínima do Android SDK é 21 (Android 5.0).

Atenção: comandos como pip, npm ou cargo não são usados para esta biblioteca, pois é uma biblioteca nativa do Android.

3. Início rápido — exemplo mínimo funcional

Coloque o arquivo JSON da animação (por exemplo, animation.json) na pasta app/src/main/res/raw. Em seguida, adicione o LottieAnimationView ao seu arquivo de layout:

<!-- activity_main.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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.airbnb.lottie.LottieAnimationView
        android:id="@+id/animationView"
        android:layout_width="200dp"
        android:layout_height="200dp"
        app:lottie_rawRes="@raw/animation"
        app:lottie_autoPlay="true"
        app:lottie_loop="true"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

Código na Activity (ou Fragment) em Kotlin:

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import com.airbnb.lottie.LottieAnimationView

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val animationView: LottieAnimationView = findViewById(R.id.animationView)
        animationView.playAnimation()
    }
}

Este exemplo mínimo reproduzirá a animação do recurso raw/animation.json em loop infinito.