compose navigation 自定义navtype

Jetpack compose navigation with custom NavType

https://www.youtube.com/watch?v=qBxaZ071N0c&t=182s

定义两个路由

@Serializable
data object DogListRoute

@Serializable
data class DogDetailRoute(
    val dog: Dog,
    val breedSize: BreedSize
)

即两个页面，一个狗列表页面，点击列表项，进入狗详情界面。

大部分情况下，我们应该是传狗的ID，然后在狗详情界面，通过查询本地数据库or API，去获取狗详情信息。

但是这里演示一个自定义的数据类型，通过navtype来传递。

可以看到 DogDetailRoute带了两个参数，一个是自定义类型Dog。另一个是枚举类型 BreedSize

@Serializable
data class Dog(
    val id: Int,
    val name: String,
)

enum class BreedSize {
    SMALL,
    MEDIUM,
    LARGE
}

序列化需要引入

plugin
jetbrains-kotlin-serialization = { id = "org.jetbrains.kotlin.plugin.serialization", version.ref = "kotlin" }

implementation

kotlinx-serialization-json = { group = "org.jetbrains.kotlinx", name = "kotlinx-serialization-json", version = "1.6.3" }

通过自定义navtype可以方便的在导航过程中，传递自定义参数

                         composable<DogListRoute> {
                            DogListScreen(
                                onDogClick = { dog, breedSize ->
                                    navController.navigate(
                                        DogDetailRoute(
                                            dog = dog,
                                            breedSize = breedSize
                                        )
                                    )
                                }
                            )
                        }
                        composable<DogDetailRoute>(
                            typeMap = mapOf(
                                typeOf<Dog>() to CustomNavType.DogType,
                                typeOf<BreedSize>() to NavType.EnumType(BreedSize::class.java)
                            )
                        ) {
                            val arguments = it.toRoute<DogDetailRoute>()
                            DogDetailScreen(
                                dog = arguments.dog,
                                breedSize = arguments.breedSize
                            )
                        }

navController.navigate 直接放入带自定义参数的 route，在接收端，通过 toRoute直接获取组装后的带自定义参数的route，但是前提条件是，需要注册号typeMap

 typeMap = mapOf(
                                typeOf<Dog>() to CustomNavType.DogType,
                                typeOf<BreedSize>() to NavType.EnumType(BreedSize::class.java)

通过CustomNavType.DogType告诉navigator怎么对dog进行转换

object CustomNavType {

    val DogType = object : NavType<Dog>(
        isNullableAllowed = false
    ) {
        override fun get(bundle: Bundle, key: String): Dog? {
            return Json.decodeFromString(bundle.getString(key) ?: return null)
        }

        override fun parseValue(value: String): Dog {
            return Json.decodeFromString(Uri.decode(value))
        }

        override fun serializeAsValue(value: Dog): String {
            return Uri.encode(Json.encodeToString(value))
        }

        override fun put(bundle: Bundle, key: String, value: Dog) {
            bundle.putString(key, Json.encodeToString(value))
        }
    }
}

其中 使用URI编码主要用于将URI中的特殊字符转化为一种通用的格式