android - 使用 Compose 在导航中的可组合项之间制作动画

Question

我已经开始尝试使用 Navigation 进行撰写。
我创建了 2 个 Composable，一切正常。
但我缺少的是页面之间的动画(或过渡)。我没有找到任何资源指出如何在 Compose 中执行此操作。
我知道所有动画都基于 Compose 中的状态，但我唯一知道的是 Navigation Back Stack。

Answer 1

您可以使用我制作的可组合来显示进入动画(在“进入”和“退出”参数中配置首选效果)

fun EnterAnimation(content: @Composable () -> Unit) {
    AnimatedVisibility(
        visible = true,
        enter = slideInVertically(
            initialOffsetY = { -40 }
        ) + expandVertically(
            expandFrom = Alignment.Top
        ) + fadeIn(initialAlpha = 0.3f),
        exit = slideOutVertically() + shrinkVertically() + fadeOut(),
        content = content,
        initiallyVisible = false
    )
}

你可以像这样使用它:

NavHost(
    navController = navController,
    startDestination = "dest1"
) {
    composable("dest1") {
        EnterAnimation {
            FirstScreen(navController)
        }
    }
    composable("dest2") {
        EnterAnimation {
            SecondScreen(navController)
        }
    }
}