Configurar a volta preditiva

A volta preditiva e as animações do sistema estão ativadas por padrão. Se o app interceptar o evento de retorno e você ainda não tiver migrado para a volta preditiva, atualize o app para usar as APIs de navegação de retorno compatíveis.

Ativar animações padrão do sistema

As animações do sistema de volta à tela inicial, entre atividades e entre tarefas estão disponíveis em dispositivos Android 15 e mais recentes para apps que migraram para as APIs de processamento de retorno compatíveis.

• Volta à tela inicial: retorna o usuário à tela inicial.
• Entre atividades: faz a transição entre atividades no app.
• Entre tarefas: faz a transição entre tarefas.

Essas animações são ativadas por padrão no Android 15 e versões mais recentes. Em dispositivos com o Android 13 ou 14, os usuários podem ativá-las nas opções do desenvolvedor.

Para receber as animações do sistema, atualize a dependência Activity do AndroidX para a versão 1.6.0 ou mais recente.

Ativar a volta preditiva com o Navigation Compose

Para usar a volta preditiva no Navigation Compose, verifique se você está usando a navigation-compose 2.8.0 biblioteca ou mais recente.

O Navigation Compose faz a transição automática entre as telas quando o usuário desliza para trás:

Ao navegar, é possível criar transições personalizadas com popEnterTransition e popExitTransition. Quando aplicados ao NavHost, esses modificadores permitem definir como as telas de entrada e saída são animadas. É possível usá-los para criar vários efeitos, como dimensionamento, esmaecimento ou deslizamento.

Neste exemplo, scaleOut é usado em popExitTransition para reduzir a tela de saída à medida que o usuário navega para trás. Além disso, o parâmetro transformOrigin determina o ponto em torno do qual a animação de dimensionamento ocorre. Por padrão, é o centro da tela (0.5f, 0.5f). Você pode ajustar esse valor para fazer com que o dimensionamento se origine em outro ponto.

NavHost(
    navController = navController,
    startDestination = Home,
    popExitTransition = {
        scaleOut(
            targetScale = 0.9f,
            transformOrigin = TransformOrigin(pivotFractionX = 0.5f, pivotFractionY = 0.5f)
        )
    },
    popEnterTransition = {
        EnterTransition.None
    },
    modifier = modifier,
)
PredictiveBackSnippets.kt

Este código produz o seguinte resultado:

popEnterTransition e popExitTransition controlam especificamente as animações ao remover a backstack, com um gesto de retorno, por exemplo. Também é possível usar enterTransition e exitTransition para definir animações para entrar e sair de elementos combináveis em geral, não apenas para a volta preditiva. Se você definir apenas enterTransition e exitTransition, eles serão usados para a navegação normal e para remover a backstack. No entanto, o uso de popEnterTransition e popExitTransition permite criar animações distintas para a navegação de retorno.

Integrar com transições de elementos compartilhados

As transições de elementos compartilhados fornecem uma conexão visual suave entre elementos combináveis com conteúdo compartilhado, geralmente usados para navegação.

Para usar elementos compartilhados com o Navigation Compose, consulte Volta preditiva com elementos compartilhados.

Oferecer suporte à volta preditiva com componentes de composição do Material

Muitos componentes na biblioteca de composição do Material são projetados para funcionar perfeitamente com gestos de volta preditiva. Para ativar animações de volta preditiva nesses componentes, inclua a dependência mais recente do Material3 (androidx.compose.material3:material3-*:1.3.0 ou mais recente) no seu projeto.

Os componentes do Material que oferecem suporte a animações de volta preditiva incluem:

• SearchBar
• ModalBottomSheet
• ModalDrawerSheet/DismissibleDrawerSheet
• ModalNavigationDrawer/DismissibleNavigationDrawer

SearchBar e ModalBottomSheet são animados automaticamente com gestos de volta preditiva. ModalNavigationDrawer, ModalDrawerSheet, DismissibleDrawerSheet e DismissibleNavigationDrawer exigem que você transmita o drawerState para os elementos combináveis de conteúdo da planilha.

Testar a animação do gesto de volta preditivo

Se você ainda usa o Android 13 ou 14, é possível testar a animação de volta à tela inicial.

Para testar essa animação, siga estas etapas:

1. No dispositivo, acesse Configurações > Sistema > Opções do desenvolvedor.
2. Selecione Animações de gestos "Voltar" preditivos.
3. Inicie o app atualizado e use o gesto "Voltar" para testar o recurso.

No Android 15 e versões mais recentes, esse recurso é ativado por padrão.

Outros recursos

• Codelab de animações de volta preditiva
• Vídeo de animações de layout avançadas no Compose (link em inglês)