Aggiungere il supporto per le animazioni predittive per la schiena

Quando utilizzi le API di sistema di backup, puoi attivare la ricezione di animazioni in-app e supportare le transizioni personalizzate.

Dopo l'attivazione, l'app mostra animazioni per il ritorno alla schermata Home, il passaggio da un'attività all'altra e il passaggio da un'attività all'altra.

Puoi anche eseguire l'upgrade della dipendenza dei componenti Material alla versione 1.10.0 di MDC Android per ricevere animazioni dei componenti Material come la seguente:

• Bottom sheet
• Fogli laterali
• Ricerca

Per maggiori informazioni, consulta le linee guida per gli sviluppatori di componenti Material su GitHub.

Il video mostra un breve esempio di animazioni di Indietro predittive per il passaggio da un'attività all'altra e per il ritorno alla schermata Home utilizzando l'app Impostazioni di Android.

1. Nell'animazione, l'utente scorre verso il retro per tornare alla schermata delle impostazioni precedente, un esempio di animazione tra attività.
2. Ora, nella schermata precedente, l'utente inizia a scorrere verso il retro un'altra volta, mostrando un'anteprima della schermata Home con lo sfondo, un esempio dell'animazione di ritorno alla schermata Home.
3. L'utente continua a scorrere verso destra, mostrando un'animazione della finestra che si riduce all'icona nella schermata Home.
4. L'utente è tornato completamente alla schermata Home.

Scopri di più su come aggiungere il supporto per i gesti di ritorno predittivi.

Aggiungere transizioni e animazioni in-app personalizzate

Puoi creare animazioni e transizioni personalizzate per le proprietà in-app, animazioni personalizzate tra attività e animazioni personalizzate tra frammenti con i gesti di ritorno predittivi.

Aggiungere transizioni personalizzate utilizzando l'API Progress

Con AndroidX Activity 1.8.0-alpha01 o versioni successive, puoi utilizzare le API di avanzamento del gesto Indietro predittivo per sviluppare animazioni personalizzate per il gesto Indietro predittivo nella tua app. Le API di avanzamento sono utili per animare le visualizzazioni, ma presentano limitazioni per l'animazione delle transizioni tra i frammenti. In OnBackPressedCallback abbiamo introdotto i metodi handleOnBackProgressed, handleOnBackCancelled e handleOnBackStarted per animare gli oggetti quando l'utente scorre verso il retro. Utilizza questi metodi se devi personalizzare più delle animazioni predefinite fornite dal sistema o le animazioni dei componenti Material.

Prevediamo che la maggior parte delle app utilizzi le API AndroidX compatibili con le versioni precedenti, ma esistono anche API di piattaforma simili all'interno dell'interfaccia OnBackAnimationCallback disponibili per il test in Android 14 Developer Preview 1 e versioni successive.

Utilizzare le API Progress con le transizioni AndroidX

Le API Progress possono essere utilizzate con AndroidX Transitions 1.5.0-alpha01 o versioni successive su Android 14 e versioni successive per creare transizioni Indietro predittive.

1. Utilizza TransitionManager#controlDelayedTransition anziché beginDelayedTransition per riprodurre le transizioni quando l'utente scorre verso il retro.
2. Crea la transizione entro handleOnBackStarted.
3. Riproduci la transizione con l'evento Indietro in handleOnBackProgressed collegando currentFraction a BackEvent.progress, che mostra quanto l'utente ha swipato verso il retro.
4. Completa la transizione dopo che l'utente ha eseguito il gesto Indietro in handleOnBackPressed.
5. Infine, reimposta lo stato della transizione entro handleOnBackCancelled.

Il video, il codice Kotlin e il codice XML che seguono mostrano una transizione personalizzata tra due riquadri implementata con 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>

Quando utilizzi le transizioni Indietro predittive, tieni presente quanto segue:

• Usa isSeekingSupported per verificare se la transizione supporta Indietro predittivo.
• Sostituisci isSeekingSupported per restituire true per le transizioni personalizzate.
• Crea un controller per animazione.
• Le transizioni Indietro predittive sono supportate con le transizioni AndroidX, ma non con le transizioni del framework. Esegui la migrazione dalle transizioni del framework e utilizza invece le transizioni Animator e AndroidX.
• Le transizioni Indietro predittive sono supportate sui dispositivi con Android 14 e versioni successive e non sono compatibili con le versioni precedenti.
• Sono supportate anche le transizioni create con le scene XML. In handleOnBackStarted, imposta TransitionSeekController sul risultato di TransitionManager.createSeekController anziché sul risultato di controlDelayedTransition.

Aggiungere transizioni di attività personalizzate su Android 14 e versioni successive

Per assicurarti che le transizioni di attività personalizzate supportino il pulsante Indietro predittivo su Android 14 e versioni successive, puoi utilizzare overrideActivityTransition anziché overridePendingTransition. Ciò significa che l'animazione di transizione viene riprodotta quando l'utente scorre verso il retro.

Per fornire un esempio di come potrebbe funzionare, immagina uno scenario in cui l'attività B si trova sopra l'attività A nella pila posteriore. Gestisci le animazioni personalizzate delle attività nel seguente modo:

• Chiama le transizioni di apertura o chiusura all'interno del metodo onCreate dell'attività B.
• Quando l'utente passa all'attività B, utilizza OVERRIDE_TRANSITION_OPEN. Quando l'utente scorre per tornare all'attività A, utilizza OVERRIDE_TRANSITION_CLOSE.

• Quando specifichi OVERRIDE_TRANSITION_CLOSE, enterAnim è l'animazione di entrata dell'attività A e exitAnim è l'animazione di uscita dell'attività B.

Aggiunta del supporto per Indietro predittivo con frammenti

Esistono due approcci per implementare Torna indietro predittivo con i frammenti.

Utilizzare le API esistenti

Ti consigliamo di utilizzare le API esistenti. Queste API ti consentono di scorrere dal крае dello schermo per manipolare le transizioni Animator o AndroidX con il gesto. Se il gesto supera una soglia, viene completato e torni al frammento precedente oppure viene annullato e rimani nel frammento corrente. Per ulteriori informazioni, consulta la sezione Spostarsi tra i frammenti utilizzando le animazioni.

Tieni presente i seguenti fattori:

• Importa Transitions 1.5.0 o successiva e Fragments 1.7.0 o successiva. Gran parte del supporto della funzionalità Indietro predittiva all'interno di Fragment si basa sulla possibilità di Transitions di cercare animazioni, il che è possibile solo in Transitions 1.5.0 o versioni successive.
• Utilizza i frammenti con FragmentManager o il componente di navigazione per gestire la pila di ritorno. Il pulsante Indietro predittivo non è supportato se gestisci il tuo stack Indietro. Esegui la migrazione dalle serie precedenti di cui FragmentManager non è a conoscenza.
• Alcune librerie includono il supporto di Indietro predittivo. Per sicurezza, consulta la documentazione.
• La classe Animator e la libreria AndroidX Transition sono supportate.
• La classe Animation e la libreria del framework Transition non sono supportate.
• Le animazioni predittive funzionano solo sui dispositivi con Android 14 o versioni successive.

Utilizza i cross-fragment di ritorno predittivi nelle seguenti situazioni:

• Anima il componente di navigazione.
• Crea animazioni con setCustomAnimations.
• Anima le transizioni di entrata e uscita con setEnterTransition, setExitTransition, setReenterTransition e setReturnTransition.
• Anima le transizioni degli elementi condivisi con setSharedElementEnterTransition e setSharedElementReturnTransition.

Alcuni movimenti dei materiali supportano il ritorno predittivo a partire dalla versione 1.12.02-alpha02 o successive, tra cui MaterialFadeThrough, MaterialSharedAxis e MaterialFade. Nota: MaterialContainerTransform non supporta il recupero predittivo.

Utilizzare i callback

Puoi creare una transizione tra frammenti utilizzando i callback, ma esiste un limite noto quando si utilizzano i callback: gli utenti non possono vedere il frammento precedente quando scorrono verso il passato. Per creare una transizione di elementi condivisi tra frammenti che corrisponda alle linee guida di progettazione per il design predittivo, procedi come segue:

Crea un OnBackPressedCallback. In handleOnBackProgressed, scala e muovi il frammento. Quindi, estrailo dalla pila posteriore. Successivamente, esegui la transizione dell'elemento condiviso utilizzando setSharedElementReturnTransition all'esterno del callback.

Per maggiori informazioni, consulta l'esempio di codice su GitHub.

Requisiti

Utilizza la seguente tabella per capire cosa viene controllato da targetSdkVersion e compileSdkVersion, dalla versione del dispositivo, dalle dipendenze, dai flag manifest e dai flag dei frammenti. Questa tabella fa riferimento ai requisiti del codice.

Risorse aggiuntive

• Esempi di codice per la funzionalità Indietro predittiva
• Nozioni di base per i video del retro del sistema
• Prepararsi al futuro dei video su Android