How to remove default transitions in Jetpack Compose Navigation-CodePudding

I'm using the following sippet of code to navigate from a composable to another one, but it has a default fade animation. How can I remove it? I tried using an empty anim resource but it doesn't work.

navHostController.navigate(
    "destination_route",
    navOptions {
        popUpTo("this_route") {
            inclusive = true
        }
        anim {
            enter = R.anim.empty_animation
            exit = R.anim.empty_animation
            popEnter = R.anim.empty_animation
            popExit = R.anim.empty_animation
        }
    }
)

R.anim.empty_animation:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!--Empty to disable animation-->
</set>

CodePudding user response：

As of right now, as EpicPandaForce said it is not possible, but that is because it is in the works!

Currently this functionality is served under accompanist, in the accompanist-navigation-animation artifact. You can read more about it here or in a more detailed blogpost here where they talk a bit about the future of it too.

The gist of it is that with that dependency (and without it when it eventually gets merged to the normal navigation-compose library) you will be able to write something like this:

composable(
  "profile/{id}",
  enterTransition = { _, _ ->
    // Whatever EnterTransition object you want, like:
    fadeIn(animationSpec = tween(2000))
  }
) { // Content }

CodePudding user response：

Currently, there is no way to configure the animations in the NavHost offered by Navigation-Compose's current version (2.4.0-beta02).

@Composable
public fun NavHost(
    navController: NavHostController,
    graph: NavGraph,
    modifier: Modifier = Modifier
) {
    val backStackEntry = visibleTransitionsInProgress.lastOrNull() ?: visibleBackStack.lastOrNull()

    var initialCrossfade by remember { mutableStateOf(true) }
    if (backStackEntry != null) {
        // while in the scope of the composable, we provide the navBackStackEntry as the
        // ViewModelStoreOwner and LifecycleOwner
        Crossfade(backStackEntry.id, modifier) { //// <<----- this

As Crossfade is not configurable, the transition cannot be changed.

To change the animation, you have to abandon using the NavHost provided by Navigation-Compose.