Dodano obsługę animacji przewidywanego przejścia wstecz

Podczas korzystania z systemowych interfejsów API przycisku Wstecz możesz wyrazić zgodę na otrzymywanie animacji w aplikacji i obsługę niestandardowych przejść.

Film 1. Animacje przewidywanego przejścia wstecz

Po włączeniu tej funkcji aplikacja wyświetla animacje powrotu do ekranu głównego, przechodzenia między aktywnościami i przechodzenia między zadaniami.

Film przedstawia krótki przykład animacji przewidywanego przejścia wstecz między aktywnościami i powrotu do ekranu głównego w aplikacji Ustawienia na Androidzie.

  1. W animacji użytkownik przesuwa palcem wstecz, aby wrócić do poprzedniego ekranu ustawień – to przykład animacji między aktywnościami.
  2. Teraz na poprzednim ekranie użytkownik zaczyna przesuwać palcem wstecz po raz drugi, wyświetlając podgląd ekranu głównego z tapetą – przykład animacji powrotu do ekranu głównego.
  3. Użytkownik nadal przesuwa palcem w prawo, co powoduje wyświetlenie animacji okna zmniejszającego się do ikony na ekranie głównym.
  4. Użytkownik wrócił do ekranu głównego.

Dowiedz się więcej o dodawaniu obsługi gestów przewidywanego przejścia wstecz.

Dodawanie niestandardowych przejść i animacji w aplikacji

Za pomocą Compose lub widoków możesz tworzyć niestandardowe animacje i przejścia właściwości w aplikacji, niestandardowe animacje między aktywnościami i niestandardowe animacje między fragmentami z gestami przewidywanego przejścia wstecz. Aby dowiedzieć się, jak tworzyć przejścia za pomocą widoków, przeczytaj artykuł Dodawanie obsługi animacji przewidywanego przejścia wstecz w widokach.

Dodawanie niestandardowych przejść w Jetpack Compose

Możesz użyć PredictiveBackHandler do obsługi gestów przewidywanego przejścia wstecz w Jetpack Compose, aby tworzyć niestandardowe przejścia w aplikacji. Ta funkcja jest dostępna w wersji androidx.activity:activity-compose:1.8.0-alpha01 lub nowszej.

PredictiveBackHandler udostępnia funkcję lambda wywołania zwrotnego, która ujawnia Flow<BackEventCompat>, który emituje zdarzenia, gdy użytkownik przesuwa palcem od krawędzi. Te zdarzenia dostarczają informacji o pozycji dotknięcia użytkownika, krawędzi przesunięcia i, co najważniejsze, progress, które można wykorzystać do animowania komponentów w ramach obsługi gestu wstecz.

Poniższy fragment kodu pokazuje przykład użycia PredictiveBackHandler do animowania Surface, który zmniejsza się i oddala w miarę wykonywania gestu:

@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 { IntOffset(x = xOffset.dp.roundToPx(), y = 0) },
            color = Color.Blue
        ) {}
    }
}