Unterstützung für vorausschauende Zurück-Animationen hinzufügen

Wenn Sie die System Back-APIs verwenden, können Sie In-App-Animationen aktivieren und benutzerdefinierte Übergänge unterstützen.

Nachdem Sie die Funktion aktiviert haben, werden in Ihrer App Animationen für den Wechsel zum Startbildschirm, zwischen Aktivitäten und zwischen Aufgaben angezeigt.

Das Video zeigt ein kurzes Beispiel für die Animationen der intelligenten „Zurück“-Geste für den Wechsel zwischen Aktivitäten und den Startbildschirm in den Android-Einstellungen.

1. In der Animation wischt der Nutzer zurück, um zum vorherigen Einstellungsbildschirm zurückzukehren. Dies ist ein Beispiel für eine aktivitätsübergreifende Animation.
2. Auf dem vorherigen Bildschirm wischt der Nutzer nun ein zweites Mal zurück. Es wird eine Vorschau des Startbildschirms mit dem Hintergrundbild angezeigt – ein Beispiel für die Animation „Zurück zum Startbildschirm“.
3. Der Nutzer wischt weiter nach rechts. Es wird eine Animation angezeigt, in der das Fenster auf das Symbol auf dem Startbildschirm verkleinert wird.
4. Der Nutzer ist nun vollständig zum Startbildschirm zurückgekehrt.

Weitere Informationen zum Hinzufügen von Unterstützung für vorhersagende Zurück-Gesten

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

Sie können benutzerdefinierte In-App-Property-Animationen und ‑Übergänge, benutzerdefinierte aktivitätsübergreifende Animationen und benutzerdefinierte fragmentübergreifende Animationen mit vorhersagbaren Rückwärtsgesten erstellen.

Benutzerdefinierte Übergänge in Jetpack Compose hinzufügen

Mit PredictiveBackHandler können Sie vorhersagende Zurück-Gesten in Jetpack Compose verarbeiten, um benutzerdefinierte In-App-Übergänge zu erstellen. Diese Funktion ist in androidx.activity:activity-compose:1.8.0-alpha01 und höher verfügbar.

PredictiveBackHandler stellt eine Callback-Lambda-Funktion bereit, die ein Flow<BackEventCompat> verfügbar macht, das Ereignisse ausgibt, wenn der Nutzer vom Rand zurückwischt. Diese Ereignisse liefern Informationen zur Berührungsposition des Nutzers, zur Wischkante und vor allem zu progress, die verwendet werden können, um Komponenten im Rahmen der Verarbeitung der Zurück-Geste zu animieren.

Das folgende Snippet zeigt ein Beispiel für die Verwendung von PredictiveBackHandler, um eine Surface zu animieren, die mit dem Fortschritt der Geste verkleinert und entfernt wird:

@Composable
fun DetailScreen(onBack: () -> Unit) {
    var scale by remember { mutableFloatStateOf(1f) }
    var xOffset by remember { mutableFloatStateOf(0f) }
    val scope = rememberCoroutineScope()

    PredictiveBackHandler { progressFlow ->
        try {
            progressFlow.collectLatest { backEvent ->
                scale = 1f - backEvent.progress
                xOffset = backEvent.progress * 100f
            }
            // User completed gesture
            onBack()
        } catch (e: CancellationException) {
            // User cancelled gesture
            // Animate scale and xOffset back to 1f and 0f respectively
            scope.launch {
                animate(scale, 1f) { value, _ -> scale = value }
            }
            scope.launch {
                animate(xOffset, 0f) { value, _ -> xOffset = value }
            }
        }
    }
    Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
        Surface(
            modifier = Modifier
                .size(200.dp)
                .scale(scale)
                .offset(x = xOffset.dp, y = 0.dp),
            color = Color.Blue
        ) {}
    }
}