Unterstützung für integrierte und benutzerdefinierte Animationen für die intelligente „Zurück“-Touch-Geste

Wenn Sie Ihre App bereits zu den neuen APIs migriert haben, können Sie Folgendes tun: Der Option „Vorhersagbar zurück“ aktivieren, um automatisch In-App-Benachrichtigungen zu erhalten Animationen und unterstützen benutzerdefinierte Übergänge.

Unterstützung für integrierte In-App-Animationen hinzufügen

<ph type="x-smartling-placeholder">
Video: Vorhersagbare Rückenanimationen

Nach der Aktivierung zeigt deine App Animationen für den Rücken zu Hause, und aufgabenübergreifend arbeiten.

Sie können auch ein Upgrade Ihrer Abhängigkeit von wesentlichen Komponenten auf Version 1.10.0 von MDC ausführen. Android verwendet, um Animationen zu Materialkomponenten wie die folgenden zu empfangen:

Weitere Informationen finden Sie in der Entwicklerhilfe für Materialkomponenten auf GitHub (in englischer Sprache). Informationen.

Das Video zeigt ein kurzes Beispiel für vorausschauende Rückwärtsanimationen aktivitätsübergreifend und zurück zu Hause mithilfe der Android-App "Einstellungen".

  1. In der Animation wischt der Nutzer zurück, um zu den vorherigen Einstellungen zurückzukehren. Bildschirm: ein Beispiel für eine aktivitätsübergreifende Animation.
  2. Auf dem vorherigen Bildschirm wischen Nutzende ein zweites Mal zurück, zeigt eine Vorschau des Startbildschirms mit Hintergrund – ein Beispiel für die Back-to-Home-Animation.
  3. Der Nutzer wischt weiter nach rechts und zeigt eine Animation des Fensters an. bis das Symbol auf dem Startbildschirm angezeigt wird.
  4. Der Nutzer ist jetzt vollständig zum Startbildschirm zurückgekehrt.

Weitere Informationen zur Unterstützung der automatischen Vervollständigung

Benutzerdefinierte In-App-Übergänge und -Animationen hinzufügen

Mit der Funktion Progress API und benutzerdefinierte Methode für aktivitätsübergreifende Animationen overrideActivityTransition

Benutzerdefinierte Übergänge mit der Progress API hinzufügen

Mit AndroidX Activity 1.8.0-alpha01 oder höher können Sie die Funktion Predictive Back Progress APIs zur Entwicklung benutzerdefinierter Animationen „Zurück“-Touch-Geste in Ihrer App. Innerhalb von OnBackPressedCallback haben wir handleOnBackProgressed, handleOnBackCancelled und handleOnBackStarted-Methoden zum Animieren von Objekten, während der Nutzer zurückwischt. Verwenden Sie können Sie diese Methoden anwenden, wenn Sie benutzerdefiniertere Animationen als die Standardanimationen die von den neuen Systemanimationen oder den Animationen der Material-Komponente bereitgestellt werden.

Wir gehen davon aus, dass die meisten Apps die abwärtskompatiblen AndroidX APIs verwenden. Es gibt jedoch ähnliche Plattform-APIs innerhalb des OnBackAnimationCallback die für den Test in der Entwicklervorschau 1 von Android 14 und höher verfügbar ist.

Progress APIs mit AndroidX Transitions verwenden

<ph type="x-smartling-placeholder">

Die Progress APIs können mit AndroidX Transitions 1.5.0-alpha01 oder höher verwendet werden Android 14 und höher, um Predictive Back-Übergänge zu erstellen.

  1. Verwenden Sie TransitionManager#controlDelayedTransition anstelle von beginDelayedTransition, um Übergänge als wischt der Nutzer zurück.
  2. Erstellen Sie den Übergang innerhalb von handleOnBackStarted.
  3. Spielen Sie den Übergang mit dem Ereignis „Zurück“ in handleOnBackProgressed ab, indem Sie currentFraction mit BackEvent.progress verknüpft, was zeigt, wie weit die der Nutzer zurückgewischt hat.
  4. Schließen Sie den Übergang ab, nachdem der Nutzer die Zurück-Touch-Geste in handleOnBackPressed
  5. Setzen Sie zum Schluss den Übergangsstatus in handleOnBackCancelled zurück.

Das folgende Video, der Kotlin-Code und die XML-Datei zeigen einen benutzerdefinierten Übergang zwischen zwei mit OnBackPressedCallback implementierten Feldern:

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>

Beachten Sie bei der Arbeit mit Predictive Back-Übergängen Folgendes:

  • Verwenden Sie isSeekingSupported, um zu prüfen, ob die Umstellung die Funktion „Predictive Back“ unterstützt.
  • Überschreiben Sie isSeekingSupported, damit für Ihre benutzerdefinierten Übergänge "true" zurückgegeben wird.
  • Erstellen Sie einen Controller pro Animation.
  • Predictive Back-Übergänge werden mit AndroidX-Übergängen unterstützt, aber nicht mit Framework-Übergängen. Wir empfehlen eine Migration weg vom Framework Übergänge.
  • Predictive Back-Übergänge werden auf Geräten mit Android 14 und höher nicht abwärtskompatibel.
  • Mit XML-Szenen erstellte Übergänge werden ebenfalls unterstützt. In handleOnBackStarted, setze TransitionSeekController auf das Ergebnis von TransitionManager.createSeekController anstelle des Ergebnisses von controlDelayedTransition

Benutzerdefinierte Aktivitätsübergänge unter Android 14 und höher hinzufügen

Um sicherzustellen, dass benutzerdefinierte Aktivitätenübergänge die automatische Vervollständigung unter Android 14 unterstützen und höher können Sie overrideActivityTransition statt overridePendingTransition. Das bedeutet, dass die Übergangsanimation wischt der Nutzer zurück.

Stellen Sie sich als Beispiel ein Szenario vor, Aktivität B läuft über Aktivität A im Back Stack. Sie verwalten benutzerdefinierte So können Sie Aktivitätsanimationen ansehen:

  • Rufe entweder öffnende oder schließende Übergänge innerhalb der onCreate von Aktivität B auf .
  • Wenn der Nutzer zu Aktivität B wechselt, verwende OVERRIDE_TRANSITION_OPEN. Wann? wischt der Nutzer, um zu Aktivität A zurückzukehren, OVERRIDE_TRANSITION_CLOSE
  • Bei Angabe von OVERRIDE_TRANSITION_CLOSE ist enterAnim die Aktivität A Animation starten und exitAnim ist die Exit-Animation von Aktivität B.