How to add transition animation in "Compose Destinations"- library?

Question

I want to add screen transition animation using Compose Destinations library for Navigation. here is the code While calling DestinationsNavHost() in the main composable screen without transition animation:

setContent {
        DestinationsNavHost(navGraph = NavGraphs.root)
    }

Answer 1

While calling DestinationsNavHost() in the main composable screen, do this:

        val navController = rememberAnimatedNavController()

        val navHostEngine = rememberAnimatedNavHostEngine(
            navHostContentAlignment = Alignment.TopCenter,
            rootDefaultAnimations = RootNavGraphDefaultAnimations.ACCOMPANIST_FADING,
            defaultAnimationsForNestedNavGraph = mapOf(
                NavGraphs.root to NestedNavGraphDefaultAnimations(
                    enterTransition = { slideInHorizontally() },
                    exitTransition = { slideOutHorizontally() }
                ),
            ))
        DestinationsNavHost(
            navGraph = NavGraphs.root,
            navController = navController,
            engine = navHostEngine
        )