条件转换配方
此方案演示了如何在 Navigation 3 中使用 transitionSpec 和 popTransitionSpec 创建依赖于路线的屏幕过渡。滑动方向（右、左、下、上）是根据 initialState 和 targetState 导航键对有条件地选择的。
运作方式
- 路线定义：使用实现
NavKey并标记为@Serializable的密封类层次结构来定义导航目的地（Step1、Step2、Step3、Step4）。 - 条件性正向转换 (
transitionSpec)：匹配(initialKey to targetKey)对，以确定幻灯片动画的方向：Step1$\rightarrow$Step2：向左滑动Step2$\rightarrow$Step3：向上滑动Step3$\rightarrow$Step4：向右滑动Step4$\rightarrow$Step1：滑动到底部（重新开始流程）
- 有条件的弹出过渡效果 (
popTransitionSpec)：处理在向后导航或清除返回堆栈时的反向滑动方向。 - 返回堆栈控制：演示了在执行无缝顶部滑动过渡时，如何在最后一步 (
backStack.clear()和backStack.add(Step1)) 中清除导航堆栈。
package com.example.nav3recipes.conditionaltransitions import android.os.Bundle import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.compose.animation.ContentTransform import androidx.compose.animation.slideInHorizontally import androidx.compose.animation.slideInVertically import androidx.compose.animation.slideOutHorizontally import androidx.compose.animation.slideOutVertically import androidx.compose.animation.togetherWith import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.material3.ElevatedButton import androidx.compose.material3.Scaffold import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.navigation3.runtime.NavKey import androidx.navigation3.runtime.entryProvider import androidx.navigation3.runtime.rememberNavBackStack import androidx.navigation3.ui.NavDisplay import com.example.nav3recipes.content.ContentGreen import com.example.nav3recipes.content.ContentOrange import com.example.nav3recipes.content.ContentPurple import com.example.nav3recipes.content.ContentRed import com.example.nav3recipes.sharedviewmodel.toContentKey import com.example.nav3recipes.ui.setEdgeToEdgeConfig import dagger.hilt.android.AndroidEntryPoint import kotlinx.serialization.Serializable @Serializable sealed class Step(val firstButtonTitle: String, val secondButtonTitle: String) : NavKey @Serializable data object Step1 : Step("Home", "Swipe left") @Serializable data object Step2 : Step("Swipe right", "Swipe up") @Serializable data object Step3 : Step("Swipe down", "Swipe right") @Serializable data object Step4 : Step("Swipe left", "Swipe down") @AndroidEntryPoint class ConditionalTransitionsActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setEdgeToEdgeConfig() setContent { Scaffold { paddingValues -> val backStack = rememberNavBackStack(Step1) NavDisplay( backStack = backStack, modifier = Modifier.padding(paddingValues), onBack = backStack::removeLastOrNull, entryProvider = entryProvider { entry<Step1> { ContentGreen(title = "Screen 1") { StepContent( step = it, onNext = { backStack += Step2 }, onBack = ::finish, // closing the activity ) } } entry<Step2> { ContentRed(title = "Screen 2") { StepContent( step = it, onNext = { backStack += Step3 }, onBack = backStack::removeLastOrNull, ) } } entry<Step3> { ContentOrange(title = "Screen 3") { StepContent( step = it, onNext = { backStack += Step4 }, onBack = backStack::removeLastOrNull, ) } } entry<Step4> { ContentPurple(title = "Screen 4") { StepContent( step = it, onNext = { backStack.clear() backStack.add(Step1) }, onBack = backStack::removeLastOrNull, ) } } }, transitionSpec = { val initialKey = initialState.entries.lastOrNull()?.contentKey val targetKey = targetState.entries.lastOrNull()?.contentKey when (initialKey to targetKey) { Step1.toContentKey() to Step2.toContentKey() -> swipeLeft() Step2.toContentKey() to Step3.toContentKey() -> swipeUp() Step3.toContentKey() to Step4.toContentKey() -> swipeRight() Step4.toContentKey() to Step1.toContentKey() -> swipeDown() else -> swipeRight() } }, popTransitionSpec = { val initialKey = initialState.entries.lastOrNull()?.contentKey val targetKey = targetState.entries.lastOrNull()?.contentKey when (initialKey to targetKey) { Step4.toContentKey() to Step1.toContentKey() -> swipeDown() // via backstack clearing Step2.toContentKey() to Step1.toContentKey() -> swipeRight() Step3.toContentKey() to Step2.toContentKey() -> swipeDown() Step4.toContentKey() to Step3.toContentKey() -> swipeLeft() else -> swipeLeft() } }, ) } } } } @Composable fun StepContent(step: Step, onNext: () -> Unit, onBack: () -> Unit) { Column( verticalArrangement = Arrangement.SpaceEvenly, horizontalAlignment = Alignment.CenterHorizontally, modifier = Modifier.fillMaxSize() ) { Row(horizontalArrangement = Arrangement.SpaceEvenly, modifier = Modifier.fillMaxWidth()) { ElevatedButton(onBack) { Text(text = step.firstButtonTitle) } ElevatedButton(onNext) { Text(text = step.secondButtonTitle) } } } } private fun swipeLeft(): ContentTransform = slideInHorizontally(initialOffsetX = { it }) togetherWith slideOutHorizontally(targetOffsetX = { -it }) private fun swipeUp(): ContentTransform = slideInVertically(initialOffsetY = { it }) togetherWith slideOutVertically(targetOffsetY = { -it }) private fun swipeRight(): ContentTransform = slideInHorizontally(initialOffsetX = { -it }) togetherWith slideOutHorizontally(targetOffsetX = { it }) private fun swipeDown(): ContentTransform = slideInVertically(initialOffsetY = { -it }) togetherWith slideOutVertically(targetOffsetY = { it })