Lottie para Swift: guia completo com exemplos

Introdução ao Lottie para Swift

\n\n

Lottie é uma poderosa biblioteca de código aberto, desenvolvida pela empresa Airbnb, que permite exibir animações vetoriais criadas no Adobe After Effects em plataformas móveis e web. As animações são exportadas para o formato JSON (através do plugin Bodymovin) e reproduzidas em tempo real sem perda de qualidade.

\n\n

Para desenvolvedores Swift, o Lottie abre possibilidades infinitas: desde simples indicadores de carregamento e ícones até animações complexas em tela cheia, telas de boas-vindas e elementos interativos de interface. Ao contrário de GIFs ou vídeos, as animações Lottie:

\n

\n
• Vetoriais — escalam sem perda de qualidade em qualquer dispositivo.
\n
• Peso reduzido — arquivos JSON geralmente pesam de 1 a 50 KB.
\n
• Interativas — é possível controlar reprodução, velocidade, cor e progresso.
\n
• Multiplataforma — o mesmo JSON funciona em iOS, Android, Web, React Native e Flutter.
\n

\n\n

Este artigo é um guia completo sobre o uso do Lottie em Swift. Você aprenderá como instalar a biblioteca, dominará todos os métodos principais, analisará um exemplo real e evitará erros comuns.

\n\n

Instalação do Lottie

\n\n

O Lottie para Swift é instalado via Swift Package Manager (SPM) ou CocoaPods. O método recomendado é o SPM, pois já está integrado ao Xcode.

\n\n

Instalação via Swift Package Manager (SPM)

\n

\n
1. No Xcode, abra o projeto e selecione File → Add Packages...
\n
2. Cole a URL do repositório: https://github.com/airbnb/lottie-ios.git
\n
3. Selecione a versão (recomenda-se a última estável) e clique em Add Package.
\n
4. Certifique-se de que o pacote foi adicionado ao seu target.
\n

\n\n

Instalação via CocoaPods

\n

Se você usa CocoaPods, adicione ao Podfile:

\n

pod 'lottie-ios'

\n

Em seguida, execute:

\n

pod install

\n\n

Instalação via Carthage (método legado)

\n

github "airbnb/lottie-ios"

\n

Execute carthage update --platform iOS e adicione o framework ao projeto.

\n\n

Importante: Após a instalação, importe a biblioteca no arquivo desejado:

\n

import Lottie

\n\n

Início rápido com exemplo de código

\n\n

Vamos criar um aplicativo simples que reproduz uma animação Lottie em tela cheia.

\n\n

Passo 1: Prepare o arquivo JSON

\n

Baixe ou crie uma animação Lottie. Para teste, use animações gratuitas do LottieFiles. Coloque o arquivo JSON (por exemplo, animation.json) na pasta Assets do seu projeto Xcode.

\n\n

Passo 2: Escreva o código

\n

import UIKit\nimport Lottie\n\nclass ViewController: UIViewController {\n    \n    private var animationView: LottieAnimationView?\n    \n    override func viewDidLoad() {\n        super.viewDidLoad()\n        \n        // 1. Inicialização da animação a partir dos Assets\n        animationView = LottieAnimationView(name: "animation")\n        \n        // 2. Configuração de tamanho e posição\n        animationView?.frame = view.bounds\n        animationView?.contentMode = .scaleAspectFit\n        \n        // 3. Adicionar à tela\n        view.addSubview(animationView!)\n        \n        // 4. Iniciar a animação\n        animationView?.play { (finished) in\n            print("Animação concluída: \\(finished)")\n        }\n    }\n}

\n\n

Execute o aplicativo — você verá a animação ser reproduzida uma vez. Para torná-la infinita, altere a chamada play para play(fromProgress: 0, toProgress: 1, loopMode: .loop).

\n\n

Principais métodos e funções do Lottie

\n\n

Abaixo estão 10 métodos principais do Lo