useLottieAnimations

O esquema de animações com o hook useLottieAnimations foi pensado para ter controle total das animações, frame-by-frame.

Tipos de Animações

1. Simples Loading

Para criar um simples loading, você não precisa passar nenhum parâmetro além do animationData.

2. Animação com Looping e KeepLastFrame

Uma animação que exige combinação de Looping e KeepLastFrame requer que o Looping esteja ativado, então você pode passar o keepLastFrame como parâmetro da animação individualmente. O loop se refere ao segmento atual da animação (intervalo de frames). Quando esse segmento chegar ao último frame, a animação verificará o keepLastFrame e parará na última frame do intervalo. Por exemplo, se sua animação está entre os frames 1 e 50, ela ficará estática no frame 50.

3. Animações com Transições sem ForceFlag

Animações com transição são mais complexas, pois exigem o conhecimento dos intervalos exatos das animações dentro do arquivo Lottie/JSON. Com esse conhecimento, é possível criar transições para diferentes pontos da animação. Por exemplo:

• State 1: Loading, este ficará se repetindo até que algum estado mude (lembre-se de ativar o isLooping).
• State 2: Se o estado mudou para sucesso, então carrega uma sequência de animações: transição -> Ok.
• State 3: Caso o estado mude para 'erro', então carrega a sequência de animações: transição -> error.

Supondo que dentro do arquivo Lottie existam 4 animações (loading, transição, ok e erro), você terá que saber onde cada uma começa e termina (em frames ou segundos - 100f=1s, já que a animação roda a 60fps), para poder combiná-las.

Outros Parâmetros

• InitialSegment: Pode ser passado se você deseja executar uma animação inicial que seja diferente da definida no arquivo. Caso não passe, o hook executará automaticamente o arquivo desde o frame 1 até o último, que foi definido durante o processo de criação do mesmo.

• action: Este parâmetro passado dentro das props da Animation permite que a ação seja executada após a animação chegar ao seu último frame. Por exemplo, fechar um modal apenas quando a animação finalizar completamente.

Licença

Este projeto é licenciado sob a Licença MIT. Consulte o arquivo LICENSE para obter detalhes.