Android Compose Navigation
引入依赖
dependencies {
implementation "androidx.navigation:navigation-compose:2.4.0-alpha10"
}
开始
val navController = rememberNavController()
创建 NavHost
NavHost(navController = navController,startDestination = "societies"){
composable("societies"){SocletyListDES()}
composable("bbs"){BBSListDES()}
composable("mine"){MineDES()}
}
//startDestination 不可用 可组合项
导航到可组合项
@Composable
fun SocietyListDES(navCrontroller: NavController){
Button(onclick={ navController.navigate("society-detail") }){
Text(text="society-detail")
}
}
一般情况下,navigate方法会将新的目的地加入返回栈,而如果需要自定义其行为
// 放弃之前所有返回栈,退回到societies,即最开始的一层
navController.navigate("society-detail"){
popUpTo("societies")
}
// Pop everything up to and including the "home" destination off
// the back stack before navigating to the "friends" destination
navController.navigate("friends") {
popUpTo("home") { inclusive = true }
}
// Navigate to the "search” destination only if we’re not already on
// the "search" destination, avoiding multiple copies on the top of the
// back stack
navController.navigate("search") {
launchSingleTop = true
}
使用参数进行导航
类似于http请求过程中使用的路由
NavHost(startDestination = "profile/{userId}"){
...
composable("profile/{userId}"){...}
}
// 默认情况下 所有参数都会被解析成字符串,也可使用 ` arguments ` 参数来设置 ` type `
NavHost(startDestination="profile/{userId}"){
...
composable(
"profile/{userId}",
arguments= listOf(navArgument("userId") { type = NavType.StringType }
) {...}
}
// 提取参数
composable("profile/{userId}") { backStackEntry ->
Profile(navController, backStackEntry.arguments?.getString("userId"))
}
// 然后如何 perform nav action
navController.navigate("profile/user1234")
添加可选参数
可选参数与必需参数有两点不同
- 可选参数必须使用查询参数语法
"?argName={argName}"
来添加 - 可选参数必须具有
defaultValue
集 或nullability = true
(也就将默认值隐式设为null
)
因此 所有可选参数都必须以列表的形式显示添加到composable()
composable("profile?userId={userId}",
arguments = listOf(navArgument("userId") { defaultValue = "me" })
) { backStackEntry ->
Profile(navController, backStackEntry.arguments?.getString("userId"))
}
通过路线处理参数的结构意味着可组合项将完全独立于Navigation,并更易于测试
深层链接
Navigation Compose 支持隐式深层链接,此类链接也可定义为 compose()
函数的一部分。
使用 navDeepLink()
以列表的形式添加深层链接
val uri = "https://example.com"
compoable("profile?id={id}",
deepLinks = listOf(navDeepLink {uriPattern = "$uri/{id}"})
){ backStackEntry ->
Profile(navController, backStackEntry.arguments?.getString("id"))
}