Configurare Indietro predittivo

Le animazioni di sistema e per il gesto Indietro predittivo sono attive per impostazione predefinita. Se la tua app intercetta l'evento Indietro e non hai eseguito la migrazione a Indietro predittivo, aggiorna l'app per utilizzare le API di navigazione a ritroso supportate.

L'animazione Indietro predittivo per tornare alla schermata Home.
L'animazione predittiva tra attività.
L'animazione predittiva tra attività.

Attiva le animazioni di sistema predefinite

Le animazioni di sistema di ritorno alla home page, tra attività e tra task sono disponibili su Android 15 e versioni successive per le app di cui è stata eseguita la migrazione alle API di gestione del pulsante Indietro supportate.

  • Torna alla home: riporta l'utente alla schermata Home.
  • Tra attività: transizioni tra attività all'interno dell'app.
  • Tra attività: transizioni tra attività.

Queste animazioni sono attive per impostazione predefinita su Android 15 e versioni successive. Sui dispositivi con Android 13 o 14, gli utenti possono attivarle tramite le Opzioni sviluppatore.

Per ottenere le animazioni di sistema, aggiorna la dipendenza AndroidX Activity alla versione 1.6.0 o successive.

Attiva Indietro predittivo con Navigation Compose

Per utilizzare Indietro predittivo in Navigation Compose, assicurati di utilizzare la libreria navigation-compose 2.8.0 o versioni successive.

Navigation Compose applica automaticamente la dissolvenza incrociata tra le schermate quando l'utente scorre indietro:

Figura 2. L'animazione in-app con dissolvenza incrociata predefinita in SociaLite.

Durante la navigazione, puoi creare transizioni personalizzate con popEnterTransition e popExitTransition. Se applicati a NavHost, questi modificatori ti consentono di definire l'animazione delle schermate di entrata e di uscita. Puoi utilizzarle per creare una serie di effetti, come ridimensionamento, dissolvenza o scorrimento.

In questo esempio, scaleOut viene utilizzato all'interno di popExitTransition per fare lo scale down della schermata di uscita quando l'utente torna indietro. Inoltre, il parametro transformOrigin determina il punto attorno al quale si verifica l'animazione di scalabilità. Per impostazione predefinita, è il centro dello schermo (0.5f, 0.5f). Puoi modificare questo valore per fare in modo che la scalabilità abbia origine da un punto diverso.

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

Questo codice produce il seguente risultato:

Figura 3. Un'animazione in-app personalizzata in SociaLite.

popEnterTransition e popExitTransition controllano in modo specifico le animazioni quando si esce dal back stack, ad esempio con un gesto Indietro. Puoi anche utilizzare enterTransition e exitTransition per definire le animazioni per l'entrata e l'uscita dai composabili in generale, non solo per Indietro predittivo. Se imposti solo enterTransition e exitTransition, questi vengono utilizzati sia per la navigazione normale sia per l'estrazione del back stack. Tuttavia, l'utilizzo di popEnterTransition e popExitTransition ti consente di creare animazioni distinte per la navigazione a ritroso.

Esegui l'integrazione con le transizioni degli elementi condivisi

Le transizioni di elementi condivisi forniscono una connessione visiva fluida tra i componibili con contenuti condivisi, spesso utilizzati per la navigazione.

Figura 4. Transizione degli elementi condivisi con Indietro predittivo in Navigation Compose.

Per utilizzare gli elementi condivisi con Navigation Compose, consulta Indietro predittivo con elementi condivisi.

Supporta Indietro predittivo con i componenti di Material Compose

Molti componenti della libreria Material Compose sono progettati per funzionare perfettamente con i gesti Indietro predittivi. Per attivare le animazioni di Indietro predittivo in questi componenti, includi nel progetto l'ultima dipendenza Material3 (androidx.compose.material3:material3-*:1.3.0 o versioni successive).

I componenti di Material che supportano le animazioni per la funzionalità Indietro predittivo includono:

SearchBar e ModalBottomSheet si animano automaticamente con i gesti Indietro predittivo. ModalNavigationDrawer, ModalDrawerSheet, DismissibleDrawerSheet e DismissibleNavigationDrawer richiedono di passare drawerState ai rispettivi composabili dei contenuti del foglio.

Testa l'animazione del gesto Indietro predittivo

Se utilizzi ancora Android 13 o Android 14, puoi testare l'animazione di ritorno alla schermata Home.

Per testare questa animazione, segui questi passaggi:

  1. Sul dispositivo, vai a Impostazioni > Sistema > Opzioni sviluppatore.
  2. Seleziona Animazioni Indietro predittivo.
  3. Avvia l'app aggiornata e utilizza il gesto Indietro per vederlo in azione.

Su Android 15 e versioni successive, questa funzionalità è attiva per impostazione predefinita.

Risorse aggiuntive