在 Jetpack Compose 中,导航应该如何完成?所有(并且没有很多)示例(包括来自 Google 的官方示例)都使用密封类并加载新屏幕以响应观察当前屏幕的变化。这确实(有点)工作,但不提供导航后台堆栈,并且手机的后退按钮完全不知道,只是关闭应用程序而不是返回上一个屏幕。这是否应该以某种方式与 AndroidX 的导航组件融合——但它是基于 XML 的,而 Compose 完全是为了远离 XML?还是有一个全新的导航概念即将到来,可能类似于 SwiftUI(navigationlink 等)?这似乎是最大的障碍之一 - 因为没有导航,您只能拥有一个玩具应用程序。有人知道这里的路线图吗?
5 回答
已为 Compose 导航发布了新的 Jetpack 库。它仍处于 alpha 阶段。
在这个新库中,现在用户可以使用导航组件功能在不同的可组合之间导航。
使用导航撰写:
dependencies {
def nav_compose_version = "1.0.0-alpha01"
implementation "androidx.navigation:navigation-compose:$nav_compose_version"
}
例子:
第 1 步:NavController
使用rememberNavController()
可组合中的方法创建一个:链接:
val navController = rememberNavController()
第 2 步:创建NavHost
需要NavController
先前创建的 viarememberNavController()
和图表起始目的地的路线:Link。
NavHost(navController, startDestination = "profile") {
composable("profile") { Profile(...) }
composable("friendslist") { FriendsList(...) }
...
}
第 3 步:导航到可组合使用navigate()
:
fun Profile(navController: NavController) {
...
Button(onClick = { navController.navigate("friends") }) {
Text(text = "Navigate next")
}
...
}
检查更多https://developer.android.com/jetpack/compose/navigation
这是 Jetpack Compose 中一种非官方的导航方法。尝试一下,直到您从 Google android 开发人员那里得到官方消息。
撰写路由器
使用androidx.navigation:navigation-compose
. 请参阅@pRaNaY 的答案。
原始答案
似乎他们正在远离 XML。
在 1.0.0-alpha 发布之后发布的新的官方示例,有一个共享代码来管理回栈和导航。此代码还不是库的一部分。
https://github.com/android/compose-samples/blob/master/Owl/app/src/main/java/com/example/owl/ui/utils/Navigation.kt https://github.com/android /compose-samples/blob/master/Jetsnack/app/src/main/java/com/example/jetsnack/ui/utils/Navigation.kt
更新
因为示例项目迁移到androidx.navigation:navigation-compose
,所以链接已失效。我试图找到链接没有失效的最新提交。
我已经写过如何使用 Jetpack Compose 处理导航
链接:https ://medium.com/@gsaillen95/how-to-handle-navigation-in-jetpack-compose-a9ac47f7f975
这是 Compose Navigation 的另一个不错的替代库:
https://github.com/olshevski/compose-navigation-reimagined
我创建它是因为官方导航组件的某些部分太奇怪了。