Android Wear OS Compose：如何实现导航滑动转场动画？

你之前用NavOptions.Builder设置动画无效，是因为这个API是给传统View体系的导航组件设计的，Compose的SwipeDismissableNavHost需要用Compose原生的动画API来配置转场，具体解决方式如下：

核心修改逻辑 #

放弃NavOptions的动画配置，直接在composable函数中指定转场动画参数。Compose内置了slideInHorizontally、slideOutHorizontally等现成的滑动动画方法，可直接复用。

完整示例代码 #

// 保留原有的导航控制器定义
val navController = rememberSwipeDismissableNavController()

SwipeDismissableNavHost(
    navController = navController,
    startDestination = Screen.FirstScreen.route,
    modifier = modifier
) {
    // 第一个页面：配置返回时的转场动画
    composable(
        route = Screen.FirstScreen.route,
        popEnterTransition = { slideInHorizontally(initialOffsetX = { it }) },
        popExitTransition = { slideOutHorizontally(targetOffsetX = { -it }) }
    ) {
        // 页面内容，触发导航的逻辑不变
        Button(onClick = { navController.navigate(Screen.SecondScreen.route) }) {
            Text("跳转到第二页")
        }
    }

    // 第二个页面：配置进入/退出的转场动画
    composable(
        route = Screen.SecondScreen.route,
        enterTransition = { slideInHorizontally(initialOffsetX = { it }) },
        exitTransition = { slideOutHorizontally(targetOffsetX = { -it }) }
    ) {
        // 页面内容，返回逻辑不变
        Button(onClick = { navController.popBackStack() }) {
            Text("返回第一页")
        }
    }
}

进阶自定义动画 #

如果需要更精细的动画控制（比如时长、缓动效果），可以提前定义统一的过渡配置：

// 自定义滑动动画的过渡规则
val slideTransitionSpec = remember {
    TransitionSpec<NavBackStackEntry> {
        slideInHorizontally(
            initialOffsetX = { it },
            animationSpec = tween(durationMillis = 300, easing = FastOutSlowInEasing)
        ) togetherWith
        slideOutHorizontally(
            targetOffsetX = { -it },
            animationSpec = tween(durationMillis = 300, easing = FastOutSlowInEasing)
        )
    }
}

之后在composable中直接引用：enterTransition = slideTransitionSpec.enter

原方法无效的原因 #

NavOptions.Builder的setEnterAnim/setExitAnim是针对Android View体系的FragmentNavigator设计的，而SwipeDismissableNavHost是Compose专属导航组件，完全基于Compose动画系统，不会识别View体系的R.anim.*资源文件。

内容的提问来源于stack exchange，提问作者jihun.yun