使用系統返回 API 時,您可以選擇接收應用程式內動畫,並支援自訂轉場效果。
啟用這項功能後,應用程式會顯示返回首頁、跨活動和跨工作的動畫。
您也可以將 Material 元件的依附元件升級至 MDC Android 1.10.0 版,接收下列 Material 元件的動畫:
詳情請參閱 GitHub 上的 Material 元件開發人員指南。
這部影片中的簡短範例是使用 Android「設定」應用程式,呈現跨活動和返回首頁的預測返回動畫。
- 在動畫中,使用者往回滑動,藉此返回上一個設定畫面。這是跨活動動畫的範例。
- 接著在上一個畫面中,使用者再次往回滑動,藉此預覽主畫面和桌布。這是返回首頁動畫的範例。
- 使用者持續向右滑動,出現視窗縮小為主畫面上圖示的動畫。
- 現在使用者已完全返回主畫面。
進一步瞭解如何新增預測返回手勢支援功能。
新增自訂應用程式內轉場效果和動畫
您可以使用預測返回手勢,建立自訂應用程式內屬性動畫和轉場效果、自訂跨活動動畫,以及自訂跨元件動畫。
使用 Progress API 新增自訂轉場效果
在 AndroidX Activity 1.8.0-alpha01 以上版本中,您可以使用 Predictive Back Progress API,為應用程式的預測返回手勢開發自訂動畫。Progress API 可用於為檢視畫面建立動畫,但在 Fragments 之間建立動畫轉場效果時,會有限制。在 OnBackPressedCallback
中,我們已導入 handleOnBackProgressed
、handleOnBackCancelled
和 handleOnBackStarted
方法,可在使用者滑動返回時為物件建立動畫。如果除了系統提供的預設動畫或 Material 元件動畫,您還需要其他自訂動畫,請使用這些方法。
我們預期大部分應用程式都會使用回溯相容的 AndroidX API,但 OnBackAnimationCallback
介面也提供類似的平台 API,方便您在 Android 14 開發人員預覽版 1 以上版本中進行測試。
搭配使用 AndroidX 轉場效果與 Progress API
在 Android 14 以上版本,Progress API 可搭配使用 AndroidX Transitions 1.5.0-alpha01 以上版本,建立預測返回轉場效果。
- 使用
TransitionManager#controlDelayedTransition
(而非beginDelayedTransition
),在使用者滑動返回時顯示轉場效果。 - 在
handleOnBackStarted
中建立轉場效果。 - 將
currentFraction
與BackEvent.progress
建立關聯,公開使用者已滑動返回的距離,藉此在handleOnBackProgressed
中的返回事件顯示轉場效果。 - 在使用者於
handleOnBackPressed
中採取返回手勢後完成轉場效果。 - 最後在
handleOnBackCancelled
內重設轉場效果的狀態。
以下影片、Kotlin 程式碼和 XML 示範如何使用 OnBackPressedCallback
,在兩個方塊之間實作自訂轉場效果:
class MyFragment : Fragment() { val transitionSet = TransitionSet().apply { addTransition(Fade(Fade.MODE_OUT)) addTransition(ChangeBounds()) addTransition(Fade(Fade.MODE_IN)) } ... override fun onViewCreated(view: View, savedInstanceState: Bundle?) { super.onViewCreated(view, savedInstanceState) val callback = object : OnBackPressedCallback(enabled = false) { var controller: TransitionSeekController? = null @RequiresApi(34) override fun handleOnBackStarted(backEvent: BackEvent) { // Create the transition controller = TransitionManager.controlDelayedTransition( binding.card, transitionSet ) changeTextVisibility(ShowText.SHORT) } @RequiresApi(34) override fun handleOnBackProgressed(backEvent: BackEvent) { // Play the transition as the user swipes back if (controller?.isReady == true) { controller?.currentFraction = backEvent.progress } } override fun handleOnBackPressed() { // Finish playing the transition when the user commits back controller?.animateToEnd() this.isEnabled = false } @RequiresApi(34) override fun handleOnBackCancelled() { // If the user cancels the back gesture, reset the state transition(ShowText.LONG) } } binding.shortText.setOnClickListener { transition(ShowText.LONG) callback.isEnabled = true } this.requireActivity().onBackPressedDispatcher.addCallback(callback) } private fun transition(showText: ShowText) { TransitionManager.beginDelayedTransition( binding.card, transitionSet ) changeTextVisibility(showText) } enum class ShowText { SHORT, LONG } private fun changeTextVisibility(showText: ShowText) { when (showText) { ShowText.SHORT -> { binding.shortText.isVisible = true binding.longText.isVisible = false } ShowText.LONG -> { binding.shortText.isVisible = false binding.longText.isVisible = true } } } }
<?xml version="1.0" encoding="utf-8"?>
...
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
...>
<TextView
android:id="@+id/short_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
... />
<TextView
android:id="@+id/long_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"
.../>
</androidx.constraintlayout.widget.ConstraintLayout>
使用預測返回轉場效果時,請注意下列事項:
- 使用
isSeekingSupported
,檢查轉場效果是否支援預測返回手勢。 - 覆寫
isSeekingSupported
,針對自訂轉場效果傳回 true。 - 為每個動畫建立一個控制器。
- AndroidX 轉換支援預測返回轉場效果,但架構轉換不支援。移除架構轉場效果,改用
Animator
和 AndroidX 轉場效果。 - 預測返回轉場效果適用於搭載 Android 14 以上版本的裝置,且無法回溯相容。
- 系統也支援使用 XML 場景建立的轉場效果。在
handleOnBackStarted
中,請將TransitionSeekController
設為TransitionManager.createSeekController
的結果,而非controlDelayedTransition
的結果。
在 Android 14 以上版本新增自訂活動轉場效果
如要在 Android 14 以上版本中,確保自訂活動轉場效果可支援預測返回手勢,您可以使用 overrideActivityTransition
,而不使用 overridePendingTransition
。這表示使用者滑動返回時,系統會播放轉場效果動畫。
以下舉例說明這項機制的運作方式。假設在返回堆疊中,活動 B 位於活動 A 上方。您會採取下列做法處理自訂活動動畫:
- 在活動 B 的
onCreate
方法中,呼叫開始或結束的轉場效果。 - 在使用者前往活動 B 時,使用
OVERRIDE_TRANSITION_OPEN
。在使用者滑動返回活動 A 時,則使用OVERRIDE_TRANSITION_CLOSE
。 如果指定
OVERRIDE_TRANSITION_CLOSE
,enterAnim
是活動 A 的進入動畫,exitAnim
則是活動 B 的結束動畫。
新支援:片段的預測返回功能
使用片段實作預測返回手勢時,有兩種方法。
使用現有的 API
建議您使用現有的 API。這些 API 可讓您從螢幕邊緣滑動,透過手勢操控 Animator 或 Androidx 轉場效果。系統會以手勢是否超過門檻,來判斷手勢是否完成,如果完成,您會返回上一個片段;如果未完成,則動作取消,您會留在目前的片段。詳情請參閱「使用動畫瀏覽各個片段」。
請注意以下因素:
- 匯入 Transition 1.5.0 以上版本和 Fragment 1.7.0 以上版本。「Fragment」中大部分的預測返回手勢支援功能,都必須仰賴「Transition」的尋找動畫功能,而只有 Transition 1.5.0 以上版本才提供這項功能。
- 使用 Fragment 搭配
FragmentManager
或 Navigation 元件來處理返回堆疊。如果您自行管理返回堆疊,系統將不支援預測返回手勢。從FragmentManager
不瞭解的回溯堆疊中遷移。 - 部分程式庫提供預測返回手勢支援功能,請參閱說明文件瞭解詳情。
- 支援
Animator
類別和AndroidX Transition
程式庫。 - 不支援
Animation
類別和架構Transition
程式庫。 - 預測動畫僅適用於搭載 Android 14 以上版本的裝置。
請在下列情況使用預測返回跨片段:
- 為導覽元件設定動畫效果。
- 使用
setCustomAnimations
設定動畫。 - 使用
setEnterTransition
、setExitTransition
、setReenterTransition
和setReturnTransition
設定進入和離開轉場效果動畫。 - 使用
setSharedElementEnterTransition
和setSharedElementReturnTransition
設定共用元素轉場效果動畫。
自 1.12.02-alpha02 以上版本起,部分 Material 動畫支援預測返回手勢,包括 MaterialFadeThrough
、MaterialSharedAxis
和 MaterialFade
。注意:「MaterialContainerTransform
」不支援預測返回。
使用回呼
您可以使用回呼建立跨片段轉場效果,但使用回呼時有已知的限制,使用者在滑動返回時無法看到先前的片段。如要建立與預測返回 設計指南相符的跨片段共用元素轉換,請執行下列操作:
建立 OnBackPressedCallback
。在 handleOnBackProgressed
中,縮放及移動程式碼片段。然後從返回堆疊彈出。接下來,請在回呼之外使用 setSharedElementReturnTransition
執行共用元素轉換。
詳情請參閱 GitHub 上的程式碼範例。
需求條件
請參閱下表,瞭解 targetSdkVersion
和 compileSdkVersion
、裝置版本、依附元件、資訊清單旗標和片段旗標控管的項目。這份表格列出程式碼需求條件。
類別 | 動畫 | compileSdk | targetSdk | 裝置版本 | android:enableOnBackInvokedCallback | 依附元件 |
---|---|---|---|---|---|---|
系統動畫 | 返回首頁 | 33 | 不限 | 35 | TRUE | 無 |
跨活動 | 34 | 不限 | 35 | TRUE | 無 | |
跨工作 | 34 | 不限 | 35 | TRUE | 無 | |
平台 | 自訂跨活動 | 34 | 不限 | 35 | TRUE | 無 |
Progress API 平台 | 34 | 不限 | 34 | TRUE | 無 | |
Material Design 元件 | 底部功能表 | 34 | 不限 | 34 | TRUE | Material 元件 1.10.0 |
側邊功能表 | 34 | 不限 | 34 | TRUE | Material 元件 1.10.0 | |
導覽匣 | 34 | 不限 | 34 | TRUE | Material 元件 1.10.0 | |
搜尋 | 34 | 不限 | 34 | TRUE | Material 元件 1.10.0 | |
Jetpack 動畫 | 自訂 AndroidX 跨片段 | 34 | 不限 | 34 | TRUE | AndroidX 片段 1.7 |
自訂 AndroidX 轉場效果 | 34 | 不限 | 34 | TRUE | AndroidX 轉場效果 1.5 | |
Progress API Jetpack | 34 | 不限 | 34 | TRUE | AndroidX 活動 1.8 |