新增對預測返回動畫的支援

使用系統返回 API 時,您可以選擇接收應用程式內動畫,並支援自訂轉場效果。

影片 1: 預測返回動畫

啟用這項功能後,應用程式會顯示返回首頁、跨活動和跨工作的動畫。

這部影片中的簡短範例是使用 Android「設定」應用程式,呈現跨活動和返回首頁的預測返回動畫。

  1. 在動畫中,使用者往回滑動,藉此返回上一個設定畫面。這是跨活動動畫的範例。
  2. 接著在上一個畫面中,使用者再次往回滑動,藉此預覽主畫面和桌布。這是返回首頁動畫的範例。
  3. 使用者持續向右滑動,出現視窗縮小為主畫面上圖示的動畫。
  4. 現在使用者已完全返回主畫面。

進一步瞭解如何新增預測返回手勢支援功能

新增自訂應用程式內轉場效果和動畫

您可以建立自訂應用程式內屬性動畫和轉場效果、自訂跨活動動畫,以及自訂跨片段動畫,並搭配預測返回手勢使用。

在 Jetpack Compose 中新增自訂轉場效果

您可以在 Jetpack Compose 中使用 PredictiveBackHandler 處理預測返回手勢,建立自訂應用程式內轉場效果。這項功能適用於 androidx.activity:activity-compose:1.8.0-alpha01以上版本。

PredictiveBackHandler 提供回呼 lambda,可公開 Flow<BackEventCompat>,在使用者從邊緣向後滑動時發出事件。這些事件會提供使用者觸控位置、滑動邊緣等資訊,最重要的是 progress,可用於將元件動畫移出畫面,做為處理返回手勢的一部分。

以下程式碼片段範例顯示如何使用 PredictiveBackHandler,根據手勢進度縮小 Surface 並移開:

@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
        ) {}
    }
}