首页 > 解决方案 > 如何处理 Jetpack Compose 中的导航?

问题描述

在 Jetpack Compose 中,导航应该如何完成?所有(并且没有很多)示例(包括来自 Google 的官方示例)都使用密封类并加载新屏幕以响应观察当前屏幕的变化。这确实(有点)工作,但不提供导航后台堆栈,并且手机的后退按钮完全不知道,只是关闭应用程序而不是返回上一个屏幕。这是否应该以某种方式与 AndroidX 的导航组件融合——但它是基于 XML 的,而 Compose 完全是为了远离 XML?还是有一个全新的导航概念即将到来,可能类似于 SwiftUI(navigationlink 等)?这似乎是最大的障碍之一 - 因为没有导航,您只能拥有一个玩具应用程序。有人知道这里的路线图吗?

标签: androidkotlinandroid-jetpackandroid-jetpack-compose

解决方案


已为 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


推荐阅读