有什么方法可以删除jetpack compose中脚手架中底部导航栏的导航动画吗？

Question

我正在为我的屏幕使用脚手架，并且有一个bottomNavigationBar插入bottomBar功能。

当我单击 中的某个项目时bottomNavigationBar，我会导航到带有此栏的另一个屏幕，并且 Jetpack Compose 使用其默认的过渡动画，看起来像淡入淡出。

但底部navigationBar在过渡过程中也会褪色，这看起来很糟糕，因为我希望它根本没有动画。

有什么办法可以删除 的过渡动画吗bottomNavigationBar？

Answer 1

根据文档，导航动画受到此问题的跟踪。

正如您在最后一条评论中看到的，用于导航的动画 API 目前由相应的伴奏库提供。但是，将来它将移回标准导航库。因此，目前我建议您使用 Accompanist 库而不是“默认”库。

如果您已经这样做了，您可以使用如下内容替换动画：

AnimatedNavHost(
    navController = navController,
    startDestination = ROUTE_MAIN,
    enterTransition = {
        if (initialState.destination.route == ROUTE_MAIN) {
            EnterTransition.None
        } else {
            slideInHorizontally(
                initialOffsetX = { it },
                animationSpec = tween(300)
            )
        }
    },
    exitTransition = {
        if (initialState.destination.route == ROUTE_MAIN) {
            ExitTransition.None
        } else {
            slideOutHorizontally(
                targetOffsetX = { -it },
                animationSpec = tween(300)
            )
        }
    },
    popEnterTransition = {
        if (targetState.destination.route == ROUTE_MAIN) {
            EnterTransition.None
        } else {
            slideInHorizontally(
                initialOffsetX = { -it },
                animationSpec = tween(300)
            )
        }
    },
    popExitTransition = {
        if (targetState.destination.route == ROUTE_MAIN) {
            ExitTransition.None
        } else {
            slideOutHorizontally(
                targetOffsetX = { it },
                animationSpec = tween(300)
            )
        }
    },
) {
    composable(ROUTE_MAIN) { ... }
    composable(ROUTE_DETAILS) { ... }
    ...
}

正如您在上面的示例中看到的，我将根据当前路线 ( ) 和目标路线 ( )ROUTE_MAIN禁用动画。EnterTransition.NoneExitTransition.NoneinitialState.destination.routetargetState.destination.route