View Transitions

Transition withAnimation SwiftUI

É possível criar transições em SwiftUI para exibir e animar novas views em cima da atual. Existem algumas transições predefinidas que permitem controlar a opacidade, escala, e até se a view deslizará ao transicionar.

Transição Entre Views

Para mostrar uma nova view com uma transição é preciso utilizar uma condicional (if, por exemplo) em conjunto com um @State Bool para definir se a view deve ou não ser exibida na tela.

Para que a animação de transição ocorra, é preciso englobar esse state com a função withAnimation, como será mostrado no exemplo a seguir.

Nesta nova view, devemos aplicar o modificador transition para definir o comportamento da transição.

Obs.: O preview do Xcode não mostra muito bem as transições, então é recomendado ver o resultado no simulador ou diretamente em um dispositivo.

Tipos de Transição

Existem vários tipos de transição predefinidas em SwiftUI, seguem algumas delas:

  • Scale: Aumenta o tamanho de uma view ao aparecer e diminui ao desaparecer.

    Também é possível customizar o multiplicador da escala e posição:


  • Slide: A view aparece entrando pela esquerda e é dispensada pela direita.


  • Opacity: Faz uma view aparecer com um efeito de fade in e desaparecer com fade out.


  • Move: Faz a view aparecer e ser dispensada pela direção especificada.


  • Offset: Similar ao move, porém dá mais controla das posições x e y da view.

Anterior
Anterior

Link

Próximo
Próximo

Divider