帮我写一个JetPack Compose Navigation转场动画
时间: 2023-05-17 12:03:43 浏览: 140
当然可以,以下是一个简单的 JetPack Compose Navigation 转场动画的示例代码:
```kotlin
@Composable
fun MyScreen(navController: NavController) {
val transition = updateTransition(targetState = true, label = "MyTransition")
val alpha by transition.animateFloat(
label = "Alpha",
transitionSpec = {
tween(durationMillis = 500)
}
) { state ->
if (state) 1f else 0f
}
val scale by transition.animateFloat(
label = "Scale",
transitionSpec = {
tween(durationMillis = 500)
}
) { state ->
if (state) 1f else 0.5f
}
Box(
Modifier
.fillMaxSize()
.alpha(alpha)
.scale(scale)
.clickable {
navController.navigate("MyOtherScreen")
}
) {
Text(text = "Click me to navigate to MyOtherScreen")
}
}
```
这个示例代码使用了 JetPack Compose 的 `updateTransition` 函数来创建一个转场动画,当用户点击屏幕时,会触发 `navController.navigate` 函数来导航到另一个屏幕。在转场动画中,我们使用了 `animateFloat` 函数来创建两个动画,一个是透明度的动画,一个是缩放比例的动画。这两个动画都使用了 `tween` 过渡效果,持续时间为 500 毫秒。最后,我们将这个动画应用到了一个 `Box` 组件上,这个组件包含了一个文本和一个点击事件,用于触发导航操作。
阅读全文