Jetpack: 使用自定义 NavType 组合导航

12 篇文章 0 订阅
9 篇文章 0 订阅

导航是指允许用户浏览、进入和退出应用程序中不同内容的交互。Navigation 库还提供了一个特定的工件,以在使用 Jetpack Compose 构建的屏幕中实现一致且惯用的导航。

当使用 jetpack compose 导航时,我们使用NavHost可组合定义了一个导航主机,它提供了一个 lambda 函数,我们可以在其中将目的地添加到NavGraphBuilder.

假设我们希望在ScreenA和之间导航ScreenB 它看起来像

NavHost(navController = navController, startDestination = "ScreenA") {
    composable("screen-a") { ScreenA(/*...*/) }
    composable("screen-b") { ScreenB(/*...*/) }
}

默认情况下,所有参数都被解析为字符串

正如文档所说,导航组合还支持在可组合目的地之间传递参数,默认情况下,所有参数都被解析为字符串。

NavHost(startDestination = "screen-a") {
    ...
    composable(
        "screen-b/{id}",
        arguments = listOf(navArgument("id") { type = NavType.StringType })
    ) {
           ScreenB(/*...*/)
      }
}

您应该NavArguments从函数NavBackStackEntry的 lambda 中可用的 中提取composable()。

composable("screen-b/{id}") { backStackEntry ->
    ScreenB(id = backStackEntry.arguments?.getString("id"))
}

要将参数传递给目的地,您需要将值添加到路由中以代替调用中的占位符以进行导航:

navController.navigate("screen-b/1")

创建自定义数据类型

上述方式在大多数情况下都有效。您只需传递 id,然后从数据库中获取附加信息。但有时您只想将数据传递到另一个屏幕而不做额外的请求。

Jetpack 导航组件允许我们创建自定义 NavType。

NavType表示可以在 a 中使用的类型NavArgument。

假设我们想将自定义的Post数据类型传递给 ScreenB

data class Post(val id: Int,val title: String,val content: String)

我们可以创建一个“Post NavType”,Post 必须首先是可包裹的。

@Parcelize
data class Post(val id: Int,val title: String,val content: String) : Parcelable

然后我们可以创建 PostType 类

class PostType : NavType<Post>(isNullableAllowed = false) {
    override fun get(bundle: Bundle, key: String): Post? {
        return bundle.getParcelable(key)
    }

    override fun parseValue(value: String): Post {
        return Gson().fromJson(value, Post::class.java)
    }

    override fun put(bundle: Bundle, key: String, value: Post) {
        bundle.putParcelable(key, value)
    }
}

PostType 从具有 Post 数据类作为类型参数的 NavType 扩展,我还使用 Gson 来反序列化 Post from 参数,该参数将是一个 json,但您可以使用您喜欢的转换器。

检索数据

我们必须更新 NavGraph 才能检索帖子

NavHost(startDestination = "screen-a") {
    ...
    composable(
        "screen-b/{post}",
        arguments = listOf(navArgument("post") { type = PostType() })
    ) {
           val post = it.arguments?.getParcelable<Post>("post")
           ScreenB(post)
      }
}

导航

现在的问题是如何将帖子作为参数传递。首先,我们必须序列化,然后将其编码为 uri。

/*...*/
onclick = {
    val post = Post(1, "My post", "this is my wonderfull post content")
    val json = Uri.encode(Gson().toJson(post))
    navController.navigate("screen-b/$json")
}
/*...*/

这很好用,但是我们可以创建一个函数来封装序列化行,在我的例子中是一个重载的toString()方法。

override fun toString(): String {
    return Uri.encode(Gson().toJson(this))
}

现在我们可以使用字符串插值

/*...*/
onclick = {
    val post = Post(1, "My post", "this is my wonderfull post content")
    navController.navigate("screen-b/$post")
}
/*...*/

结论

尽管 Jetpack Compose 团队不建议在导航可组合路由中传递 Parcelable,但有时您可能仍需要传递自定义数据类型作为参数,我希望这篇博文可以帮助您…

如果大伙有什么好的学习方法或建议欢迎大家在评论中积极留言哈,希望大家能够共同学习、共同努力、共同进步。

小编在这里祝小伙伴们在未来的日子里都可以 升职加薪,当上总经理,出任CEO,迎娶白富美,走上人生巅峰!!

不论遇到什么困难,都不应该成为我们放弃的理由!

很多人在刚接触这个行业的时候或者是在遇到瓶颈期的时候,总会遇到一些问题,比如学了一段时间感觉没有方向感,不知道该从那里入手去学习,需要一份小编整理出来的学习资料的关注我主页或者点击文末卡片免费领取~

这里是关于我自己的Android 学习,面试文档,视频收集大整理,有兴趣的伙伴们可以看看~

如果你看到了这里,觉得文章写得不错就给个赞呗?如果你觉得那里值得改进的,请给我留言,一定会认真查询,修正不足,谢谢。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值