Intelligente „Zurück“-Geste einrichten

Die intelligente „Zurück“-Geste und Systemanimationen sind standardmäßig aktiviert. Wenn deine App das „Zurück“-Ereignis abfängt und du noch nicht zur intelligenten „Zurück“-Geste migriert bist, aktualisiere deine App, um unterstützte APIs für die Zurück-Navigation zu verwenden

Standardmäßige Systemanimationen aktivieren

Die Systemanimationen für die intelligente „Zurück“-Geste zum Startbildschirm, für den Wechsel zwischen Aktivitäten und für den Wechsel zwischen 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 Zurück-Navigation migriert wurden.

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

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

Wenn du die Systemanimationen verwenden möchtest, aktualisiere deine AndroidX Activity Abhängigkeit auf 1.6.0 oder höher.

Intelligente „Zurück“-Geste mit Navigation Compose aktivieren

Wenn du die intelligente „Zurück“-Geste in Navigation Compose verwenden möchtest, musst du die navigation-compose 2.8.0 Bibliothek oder höher verwenden.

Navigation Compose blendet automatisch zwischen Bildschirmen über, wenn der Nutzer zurückwischt:

Bei der Navigation kannst du mit popEnterTransition und popExitTransition benutzerdefinierte Übergänge erstellen. Wenn diese Modifikatoren auf deinen NavHost angewendet werden, kannst du festlegen, wie die Bildschirme für den Ein- und Ausstieg animiert werden. Du kannst damit verschiedene Effekte wie Skalieren, Ausblenden oder Verschieben erstellen.

In diesem Beispiel wird scaleOut in popExitTransition verwendet, um den Bildschirm für den Ausstieg zu verkleinern, wenn der Nutzer zurücknavigiert. Außerdem bestimmt der Parameter transformOrigin den Punkt, um den herum die Skalierungsanimation stattfindet. Standardmäßig ist das die Mitte des Bildschirms (0.5f, 0.5f). Du kannst 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,
)
PredictiveBackSnippets.kt

Dieser Code erzeugt das folgende Ergebnis:

popEnterTransition und popExitTransition steuern speziell Animationen, wenn der Back-Stack mit einer Zurück-Geste entfernt wird. Du kannst auch enterTransition und exitTransition verwenden, um Animationen für das Ein- und Ausblenden von Composables im Allgemeinen zu definieren, nicht nur für die intelligente „Zurück“-Geste. Wenn du nur enterTransition und exitTransition festlegst, werden sie sowohl für die normale Navigation als auch für das Entfernen des Back-Stacks verwendet. Mit popEnterTransition und popExitTransition kannst du jedoch separate Animationen für die Rückwärtsnavigation erstellen.

Mit Übergängen für gemeinsame Elemente integrieren

Übergänge für gemeinsame Elemente sorgen für eine reibungslose visuelle Verbindung zwischen Composables mit gemeinsamen Inhalten, die häufig für die Navigation verwendet werden.

Informationen zur Verwendung von gemeinsamen Elementen mit Navigation Compose findest du unter Intelligente „Zurück“-Geste mit gemeinsamen Elementen.

Intelligente „Zurück“-Geste mit Material Compose-Komponenten unterstützen

Viele Komponenten in der Material Compose-Bibliothek sind so konzipiert, dass sie nahtlos mit der intelligenten „Zurück“-Geste funktionieren. Wenn du Animationen für die intelligente „Zurück“-Geste in diesen Komponenten aktivieren möchtest, füge die neueste Material3-Abhängigkeit (androidx.compose.material3:material3-*:1.3.0 oder höher) in dein Projekt ein.

Zu den Material-Komponenten, die Animationen für die intelligente „Zurück“-Geste unterstützen, gehören:

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

SearchBar und ModalBottomSheet werden automatisch mit Animationen für die intelligente „Zurück“-Geste versehen. ModalNavigationDrawer, ModalDrawerSheet, DismissibleDrawerSheet und DismissibleNavigationDrawer erfordern die Übergabe von drawerState an die jeweiligen Composables für den Sheet-Inhalt.

Animation für die intelligente „Zurück“-Geste testen

Wenn du noch Android 13 oder Android 14 verwendest, kannst du die Animation für die intelligente „Zurück“-Geste zum Startbildschirm testen.

So testest du diese Animation:

1. Gehe auf deinem Gerät zu Einstellungen > System > Entwickleroptionen.
2. Wähle Animationen für intelligente „Zurück“-Geste aus.
3. Starte deine aktualisierte App und verwende die Zurück-Geste, um die Animation in Aktion zu sehen.

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

Zusätzliche Ressourcen

• Codelab: Animationen für intelligente „Zurück“-Geste hinzufügen
• Video: Erweiterte Layoutanimationen in Compose