Ao usar as APIs de retorno do sistema, você pode ativar o recebimento de animações no app e o suporte a transições personalizadas.
Depois que o recurso é ativado, seu app exibe animações de volta à tela inicial entre atividades e tarefas.
Você também pode atualizar a dependência do componente do Material Design para a v1.10.0 do MDC Android para receber animações de componentes do Material Design, como estas:
Consulte as orientações para desenvolvedores de componentes do Material Design no GitHub (link em inglês) para mais informações.
O vídeo mostra um breve exemplo de animações de volta preditiva entre atividades e de volta à tela inicial usando o app Configurações do Android.
- Na animação, o usuário desliza para retornar à tela de configurações anterior, um exemplo de animação entre atividades.
- Nessa tela, o usuário começa a deslizar para voltar uma segunda vez, mostrando uma prévia da tela inicial com o plano de fundo, que é um exemplo da animação de retorno à tela inicial.
- O usuário desliza para a direita, mostrando uma animação da redução da janela até o ícone na tela inicial.
- O usuário retornou totalmente para a tela inicial.
Saiba mais sobre como Adicionar suporte a gestos de volta preditivo.
Adicionar animações e transições personalizadas no app
É possível criar animações e transições de propriedades personalizadas no app, animações personalizadas entre atividades e entre fragmentos com gestos de volta preditivos.
Adicionar transições personalizadas usando a API Progress
Com o AndroidX Activity 1.8.0-alpha01 ou mais recente, é possível usar as APIs Predictive Back
Progress para desenvolver animações personalizadas para
o gesto de volta preditivo no app. As APIs Progress são úteis para animar
visualizações, mas têm limitações na animação de transições entre fragmentos. No
OnBackPressedCallback
,
introduzimos os métodos
handleOnBackProgressed
,
handleOnBackCancelled
e
handleOnBackStarted
para animar objetos enquanto o usuário desliza para trás. Use esses métodos se precisar
personalizar mais do que as animações padrão fornecidas pelo sistema ou
as animações do componente do Material Design.
É esperado que a maioria dos apps use as APIs do AndroidX compatíveis com versões anteriores, mas também
há APIs de plataformas semelhantes na interface
OnBackAnimationCallback
disponíveis para teste na prévia para desenvolvedores 1 do Android 14. e versões mais recentes.
Usar as APIs Progress com transições do AndroidX
As APIs Progress podem ser usadas com o AndroidX Transitions 1.5.0-alpha01 ou mais recente no Android 14 e versões mais recentes para criar transições de volta preditiva.
- Use
TransitionManager#controlDelayedTransition
em vez debeginDelayedTransition
para iniciar transições quando o usuário deslizar para voltar. - Crie a transição em
handleOnBackStarted
. - Inicie a transição com o evento de retorno dentro do
handleOnBackProgressed
, relacionandocurrentFraction
aBackEvent.progress
, que expõe até que ponto o usuário deslizou para voltar. - Conclua a transição depois que o usuário confirmar o gesto de volta em
handleOnBackPressed
. - Por fim, redefina o estado da transição dentro de
handleOnBackCancelled
.
O vídeo, o código Kotlin e o XML a seguir demonstram uma transição personalizada
entre duas caixas implementadas com OnBackPressedCallback
:
class MyFragment : Fragment() { val transitionSet = TransitionSet().apply { addTransition(Fade(Fade.MODE_OUT)) addTransition(ChangeBounds()) addTransition(Fade(Fade.MODE_IN)) } ... override fun onViewCreated(view: View, savedInstanceState: Bundle?) { super.onViewCreated(view, savedInstanceState) val callback = object : OnBackPressedCallback(enabled = false) { var controller: TransitionSeekController? = null @RequiresApi(34) override fun handleOnBackStarted(backEvent: BackEvent) { // Create the transition controller = TransitionManager.controlDelayedTransition( binding.card, transitionSet ) changeTextVisibility(ShowText.SHORT) } @RequiresApi(34) override fun handleOnBackProgressed(backEvent: BackEvent) { // Play the transition as the user swipes back if (controller?.isReady == true) { controller?.currentFraction = backEvent.progress } } override fun handleOnBackPressed() { // Finish playing the transition when the user commits back controller?.animateToEnd() this.isEnabled = false } @RequiresApi(34) override fun handleOnBackCancelled() { // If the user cancels the back gesture, reset the state transition(ShowText.LONG) } } binding.shortText.setOnClickListener { transition(ShowText.LONG) callback.isEnabled = true } this.requireActivity().onBackPressedDispatcher.addCallback(callback) } private fun transition(showText: ShowText) { TransitionManager.beginDelayedTransition( binding.card, transitionSet ) changeTextVisibility(showText) } enum class ShowText { SHORT, LONG } private fun changeTextVisibility(showText: ShowText) { when (showText) { ShowText.SHORT -> { binding.shortText.isVisible = true binding.longText.isVisible = false } ShowText.LONG -> { binding.shortText.isVisible = false binding.longText.isVisible = true } } } }
<?xml version="1.0" encoding="utf-8"?>
...
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
...>
<TextView
android:id="@+id/short_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
... />
<TextView
android:id="@+id/long_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"
.../>
</androidx.constraintlayout.widget.ConstraintLayout>
Ao trabalhar com transições de volta preditiva, considere o seguinte:
- Use
isSeekingSupported
para verificar se a transição tem suporte à volta preditiva. - Substitua
isSeekingSupported
para retornar o valor "true" para suas transições personalizadas. - Crie um controle por animação.
- As transições de volta preditiva têm suporte das transições do AndroidX, mas não das de framework. Recomendamos migrar das transições de framework.
- As transições de volta preditiva podem ser usadas em dispositivos com Android 14 e versões mais recentes e não são compatíveis com versões anteriores.
- Também há suporte a transições criadas com cenas XML. Em
handleOnBackStarted
, definaTransitionSeekController
como o resultado deTransitionManager.createSeekController
em vez do resultado decontrolDelayedTransition
.
Adicionar transições de atividades personalizadas no Android 14 e versões mais recentes
Para garantir que as transições de atividades personalizadas ofereçam suporte à volta preditiva no Android 14
e versões mais recentes, você pode usar overrideActivityTransition
em vez de
overridePendingTransition
. Isso significa que a animação de transição é reproduzida quando
o usuário desliza para trás.
Um exemplo de como isso pode funcionar é um cenário em que a atividade B está acima da atividade A na backstack. Você gerenciaria animações de atividades personalizadas da seguinte maneira:
- Chame transições de abertura ou fechamento no método
onCreate
da atividade B. - Quando o usuário navegar para a atividade B, use
OVERRIDE_TRANSITION_OPEN
. Quando o usuário deslizar para voltar à atividade A, useOVERRIDE_TRANSITION_CLOSE
. Ao especificar
OVERRIDE_TRANSITION_CLOSE
,enterAnim
é a animação de entrada da atividade A, eexitAnim
é a animação de saída da atividade B.
Adicionar suporte à volta preditiva com fragmentos
Ao implementar a volta preditiva com fragmentos, há duas abordagens.
Usar APIs atuais
Recomendamos que você use as APIs atuais. Essas APIs permitem deslizar da borda da tela para manipular as transições do Animator ou do AndroidX com o gesto. Se você mover o gesto além de um limite, ele vai determinar se ele foi concluído e você retorna ao fragmento anterior ou se ele é cancelado e você permanece no fragmento atual. Para mais informações, consulte Usar animações para navegar entre fragmentos.
Não se esqueça dos seguintes fatores:
- Importe Transitions 1.5.0 ou uma versão mais recente e Fragments 1.7.0 ou uma versão mais recente. Grande parte do suporte à volta preditiva em fragmentos depende de Transitions poder buscar animações, o que só é possível na Transitions 1.5.0 ou uma versão mais recente.
- Use fragmentos com
FragmentManager
ou o componente Navigation para processar a backstack. Não há suporte à volta preditiva quando você gerencia sua própria backstack. - Algumas bibliotecas incluem suporte à volta preditiva. Verifique a documentação para ter certeza.
- Há suporte para a classe
Animator
e a bibliotecaAndroidX Transition
. - Não há suporte para a classe
Animation
e a bibliotecaTransition
do framework. - As animações preditivas só funcionam em dispositivos com o Android 14 ou versões mais recentes.
Use fragmentos cruzados de volta preditiva nas seguintes situações:
- Animar o componente de navegação.
- Animar com
setCustomAnimations
. - Anime as transições de entrada e saída com
setEnterTransition
,setExitTransition
,setReenterTransition
esetReturnTransition
. - Animar transições de elementos compartilhados com
setSharedElementEnterTransition
esetSharedElementReturnTransition
.
Alguns movimentos do Material Design
têm suporte à volta preditiva a partir da
1.12.02-alpha02
ou mais recente, incluindo MaterialFadeThrough
, MaterialSharedAxis
e
MaterialFade
. MaterialContainerTransform
não oferece suporte à volta
previsão.
Usar callbacks
É possível criar uma transição entre fragmentos usando callbacks. No entanto, há uma limitação conhecida ao usar callbacks em que os usuários não podem ver o fragmento anterior ao deslizar para trás. Para criar uma transição de elementos compartilhados entre fragmentos que corresponda à orientação de design de volta preditiva, faça o seguinte:
Crie um OnBackPressedCallback
. Dentro de handleOnBackProgressed
, escalone e
desloque o fragmento. Em seguida, retire da backstack. Em seguida, execute a transição de elemento
compartilhado usando setSharedElementReturnTransition
fora do callback.
Para mais informações, consulte o exemplo de código (link em inglês) no GitHub.
Requisitos
Use as tabelas abaixo para entender o que é controlado pelas opções do desenvolvedor,
por targetSdkVersion
e compileSdkVersion
, pela versão do dispositivo, pelas dependências,
flags de manifesto e flags de fragmento. A primeira tabela se refere aos requisitos de código.
Categoria | Animação | compileSdk | targetSdk | android:enableOnBackInvokedCallback | Dependência |
---|---|---|---|---|---|
Animações do sistema | Voltar para a tela inicial | 33 | Qualquer um | VERDADEIRO | Nenhum |
Entre atividades | 34 | Qualquer um | VERDADEIRO | Nenhum | |
Entre tarefas | 34 | Qualquer um | VERDADEIRO | Nenhum | |
Plataforma | Personalizada entre tarefas | 34 | Qualquer um | VERDADEIRO | Nenhum |
Plataforma da API Progress | 34 | Qualquer um | VERDADEIRO | Nenhum | |
Componentes do Material | Página inferior | 34 | Qualquer um | VERDADEIRO | Material Component 1.10.0 |
Página lateral | 34 | Qualquer um | VERDADEIRO | Material Component 1.10.0 | |
Gaveta de navegação | 34 | Qualquer um | VERDADEIRO | Material Component 1.10.0 | |
Pesquisar | 34 | Qualquer um | VERDADEIRO | Material Component 1.10.0 | |
Animações do Jetpack | Personalizada entre fragmentos do AndroidX | 34 | Qualquer um | VERDADEIRO | AndroidX Fragment 1.7 |
Transições personalizadas do AndroidX | 34 | Qualquer um | VERDADEIRO | AndroidX Transition 1.5 | |
API Progress do Jetpack | 34 | Qualquer um | VERDADEIRO | AndroidX Activity 1.8 |
A tabela abaixo faz referência aos requisitos que permitem mostrar animações aos usuários.
Categoria | Animação | Opção do desenvolvedor ativada | Versão do dispositivo |
---|---|---|---|
Animações do sistema | Voltar para a tela inicial | VERDADEIRO | 33 |
Entre atividades | VERDADEIRO | 34 | |
Entre tarefas | VERDADEIRO | 34 | |
Plataforma | Personalizada entre tarefas | VERDADEIRO | 34 |
Plataforma da API Progress | FALSO | 34 | |
Componentes do Material | Página inferior | FALSO | 34 |
Página lateral | FALSO | 34 | |
Gaveta de navegação | FALSO | 34 | |
Pesquisar | FALSO | 34 | |
Animações do Jetpack | Personalizada entre fragmentos do AndroidX | FALSO | 34 |
Transições personalizadas do AndroidX | FALSO | 34 | |
API Progress do Jetpack | FALSO | 34 |
Outros recursos
- Exemplos de código de retorno preditivo (link em inglês)
- Noções básicas sobre o vídeo de retorno do sistema (vídeo em inglês)
- Vídeo sobre como criar para o futuro do Android (vídeo em inglês)