使用系統返回 API 時,您可以選擇接收應用程式內動畫,並支援自訂轉場效果。
啟用這項功能後,應用程式會顯示返回首頁、跨活動和跨工作的動畫。
這部影片中的簡短範例是使用 Android「設定」應用程式,呈現跨活動和返回首頁的預測返回動畫。
- 在動畫中,使用者往回滑動,藉此返回上一個設定畫面。這是跨活動動畫的範例。
- 接著在上一個畫面中,使用者再次往回滑動,藉此預覽主畫面和桌布。這是返回首頁動畫的範例。
- 使用者持續向右滑動,出現視窗縮小為主畫面上圖示的動畫。
- 現在使用者已完全返回主畫面。
進一步瞭解如何新增預測返回手勢支援功能。
新增自訂應用程式內轉場效果和動畫
您可以建立自訂應用程式內屬性動畫和轉場效果、自訂跨活動動畫,以及自訂跨片段動畫,並搭配預測返回手勢使用。
在 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 ) {} } }