121 – Animações em FLUTTER – Flutter Animations Overview – Curso de Flutter Completo
Playlist: Curso Grátis de FLUTTER e DART Completo
Visão geral de animações
Docs
Desenvolvimento
UI
Animações
visão global
O sistema de animação no Flutter é baseado em objetos de animação digitados. Os widgets podem incorporar essas animações diretamente em suas funções de construção, lendo seu valor atual e ouvindo suas mudanças de estado ou podem usar as animações como a base de animações mais elaboradas que elas transmitem para outros widgets.
Animação
O principal bloco de construção do sistema de animação é a classe Animation. Uma animação representa um valor de um tipo específico que pode mudar durante a vida útil da animação. A maioria dos widgets que executam uma animação recebe um objeto Animation como um parâmetro, a partir do qual eles leem o valor atual da animação e para o qual eles escutam as alterações nesse valor.
addListener
Sempre que o valor da animação é alterado, a animação notifica todos os ouvintes adicionados com o addListener. Normalmente, um objeto State que atende a uma animação chamará setState em si mesmo em seu callback de notificação para notificar o sistema de widget que precisa reconstruir com o novo valor da animação.
Esse padrão é tão comum que há dois widgets que ajudam a reconstruir os widgets quando as animações mudam de valor: AnimatedWidget e AnimatedBuilder. O primeiro, AnimatedWidget, é mais útil para widgets animados sem estado. Para usar o AnimatedWidget, simplesmente subclasse-o e implemente a função de construção. O segundo, AnimatedBuilder, é útil para widgets mais complexos que desejam incluir uma animação como parte de uma função de criação maior. Para usar o AnimatedBuilder, simplesmente construa o widget e passe-lhe uma função de construtor.
addStatusListener
As animações também fornecem um AnimationStatus, que indica como a animação irá evoluir com o tempo. Sempre que o status da animação é alterado, a animação notifica todos os ouvintes adicionados com addStatusListener. Normalmente, as animações começam no status de demitido, o que significa que elas estão no início do intervalo. Por exemplo, as animações que progridem de 0,0 a 1,0 serão descartadas quando o valor for 0,0. Uma animação pode então correr para a frente (por exemplo, de 0,0 a 1,0) ou talvez em sentido inverso (por exemplo, de 1,0 a 0,0). Eventualmente, se a animação atingir o final de seu intervalo (por exemplo, 1,0), a animação alcançará o status concluído.
AnimationController
Para criar uma animação, primeiro crie um AnimationController. Além de ser uma animação em si, um AnimationController permite controlar a animação. Por exemplo, você pode dizer ao controlador para reproduzir a animação ou interromper a animação. Você também pode arremessar animações, que usam uma simulação física, como uma mola, para conduzir a animação.
Depois de criar um controlador de animação, você pode começar a criar outras animações com base nele. Por exemplo, você pode criar um ReverseAnimation que espelha a animação original, mas é executado na direção oposta (por exemplo, de 1,0 a 0,0). Da mesma forma, você pode criar um CurvedAnimation cujo valor é ajustado por uma curva.