Intelligente „Zurück“-Geste einrichten

Die intelligente „Zurück“-Touchgeste und Systemanimationen sind standardmäßig aktiviert. Wenn Ihre App das Zurück-Ereignis abfängt und Sie nicht zur vorhersagbaren Zurück-Geste migriert haben, aktualisieren Sie Ihre App, damit sie unterstützte APIs für die Zurück-Navigation verwendet.

Die Animation für die intelligente „Zurück“-Touchgeste, die zum Startbildschirm führt.
Die vorausschauende Aktivitätsanimation.
Die vorhersagende Animation für mehrere Aufgaben.

Standard-Systemanimationen aktivieren

Die Systemanimationen für das Aufrufen des Startbildschirms und das Wechseln zwischen Aktivitäten und Aufgaben sind auf Geräten mit Android 15 und höher für Apps verfügbar, die zu den unterstützten APIs für die Rückwärtsnavigation migriert wurden.

  • Zurück zur Startseite: Der Nutzer wird zur Startseite zurückgebracht.
  • Aktivitätenübergreifend: Übergänge zwischen Aktivitäten in der App.
  • Aufgabenübergreifend: Übergänge zwischen Aufgaben.

Diese Animationen sind unter Android 15 und höher standardmäßig aktiviert. Auf Geräten mit Android 13 oder 14 können Nutzer sie über die Entwickleroptionen aktivieren.

Wenn Sie die Systemanimationen verwenden möchten, aktualisieren Sie die AndroidX-Abhängigkeit Activity auf 1.6.0 oder höher.

Vorschau der intelligenten „Zurück“-Geste mit Navigation Compose aktivieren

Wenn Sie die Funktion „Vorhersagende Zurück-Geste“ in Navigation Compose verwenden möchten, müssen Sie die Bibliothek navigation-compose 2.8.0 oder höher verwenden.

Bei Navigation Compose wird automatisch zwischen Bildschirmen überblendet, wenn der Nutzer zurückwischt:

Abbildung 2. Die Standard-Crossfade-In-App-Animation in SociaLite.

Beim Navigieren können Sie mit popEnterTransition und popExitTransition benutzerdefinierte Übergänge erstellen. Wenn Sie diese Modifikatoren auf Ihre NavHost anwenden, können Sie festlegen, wie die Ein- und Ausblenden-Bildschirme animiert werden. Sie können damit verschiedene Effekte wie Skalieren, Ein- und Ausblenden oder Gleiten erstellen.

In diesem Beispiel wird scaleOut in popExitTransition verwendet, um den ausgeblendeten Bildschirm beim Zurücknavigieren des Nutzers zu verkleinern. Außerdem bestimmt der Parameter transformOrigin den Punkt, um den herum die Skalierungsanimation erfolgt. Standardmäßig ist das der Mittelpunkt des Bildschirms (0.5f, 0.5f). Sie können diesen Wert anpassen, damit die Skalierung von einem anderen Punkt ausgeht.

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

Dieser Code erzeugt das folgende Ergebnis:

Abbildung 3. Eine benutzerdefinierte In-App-Animation in SociaLite.

popEnterTransition und popExitTransition steuern Animationen speziell beim Entfernen des Backstacks, z. B. durch eine Zurück-Geste. Sie können enterTransition und exitTransition auch verwenden, um Animationen für das Ein- und Ausblenden von Composables im Allgemeinen zu definieren, nicht nur für die Vorhersage der Zurück-Geste. Wenn Sie nur enterTransition und exitTransition festlegen, werden sie sowohl für die reguläre Navigation als auch für das Entfernen von Elementen aus dem Backstack verwendet. Mit popEnterTransition und popExitTransition können Sie jedoch separate Animationen für die Rückwärtsnavigation erstellen.

Integration mit Übergängen für gemeinsame Elemente

Übergänge mit gemeinsam genutzten Elementen sorgen für eine flüssige visuelle Verbindung zwischen Composables mit gemeinsamen Inhalten, die häufig für die Navigation verwendet werden.

Abbildung 4: Übergang für freigegebene Elemente mit intelligenter „Zurück“-Geste in Navigation Compose

Informationen zur Verwendung freigegebener Elemente mit Navigation Compose finden Sie unter Predictive Back mit freigegebenen Elementen.

Unterstützung der intelligenten „Zurück“-Geste mit Material Compose-Komponenten

Viele Komponenten in der Material Compose-Bibliothek sind so konzipiert, dass sie nahtlos mit der Vorhersage der Zurück-Geste funktionieren. Wenn Sie die Vorhersage-Zurück-Animationen in diesen Komponenten aktivieren möchten, fügen Sie die aktuelle Material3-Abhängigkeit (androidx.compose.material3:material3-*:1.3.0 oder höher) in Ihr Projekt ein.

Die folgenden Material-Komponenten unterstützen Animationen für intelligente „Zurück“-Touchgesten:

SearchBar und ModalBottomSheet werden automatisch mit intelligenten „Zurück“-Touchgesten animiert. Für ModalNavigationDrawer, ModalDrawerSheet, DismissibleDrawerSheet und DismissibleNavigationDrawer müssen Sie drawerState an die entsprechenden Composables für den Tabelleninhalt übergeben.

Animation für intelligente „Zurück“-Touchgeste testen

Wenn Sie Android 13 oder Android 14 verwenden, können Sie die Animation „Zurück zum Startbildschirm“ testen.

So testen Sie diese Animation:

  1. Rufen Sie auf Ihrem Gerät die Einstellungen > System > Entwickleroptionen auf.
  2. Wählen Sie Animationen für intelligente „Zurück“-Touchgeste aus.
  3. Starten Sie die aktualisierte App und verwenden Sie die Zurück-Geste, um sie in Aktion zu sehen.

Unter Android 15 und höher ist diese Funktion standardmäßig aktiviert.

Zusätzliche Ressourcen