การไปยังส่วนต่างๆ ด้วย Compose สำหรับ Wear OS

คอมโพเนนต์การนำทางใน Android Jetpack จะให้ รองรับแอปพลิเคชัน Jetpack Compose คุณไปยังส่วนต่างๆ ระหว่าง Composable ได้ ขณะที่ใช้ประโยชน์จากโครงสร้างพื้นฐานของคอมโพเนนต์การนำทางและ ใหม่ๆ

หน้านี้อธิบายความแตกต่างของการนำทางใน Jetpack ใน Compose สำหรับ Wear OS

ตั้งค่า

ใช้ทรัพยากร Dependency ต่อไปนี้ในไฟล์build.gradle ของโมดูลแอป

Kotlin

dependencies {
    def wear_compose_version = "1.3.1"
    implementation "androidx.wear.compose:compose-navigation:$wear_compose_version"
}

รายการนี้ใช้แทน androidx.navigation:navigation-compose อาร์ติแฟกต์เหล่านี้เนื่องจากมีการใช้งานอื่นๆ สำหรับ Wear OS โดยเฉพาะ

สร้างตัวควบคุมการนำทาง โฮสต์ และกราฟ

การนำทางด้วย Compose สำหรับ Wear OS ต้องใช้คอมโพเนนต์ 3 รายการเดียวกันกับที่ต้องใช้ใน แอปที่ไม่ใช่ Wear OS: ตัวควบคุมการนำทาง โฮสต์ และกราฟ

ใช้ rememberSwipeDismissableNavController() ในการสร้างอินสแตนซ์ของ WearNavigator ซึ่งเป็นการใช้งาน NavController เหมาะสำหรับแอปพลิเคชัน Wear OS:

Kotlin

val navController = rememberSwipeDismissableNavController()

NavController คือ API หลักที่ใช้ในการไปยังส่วนต่างๆ ในแอปพลิเคชัน Compose ควบคุมการนำทาง ระหว่าง Composable ในโฮสต์การนำทาง ซึ่งใน Wear OS SwipeDismissableNavHost

Kotlin

val navController = rememberSwipeDismissableNavController()
SwipeDismissableNavHost(
    navController = navController,
    startDestination = "message_list"
) {
    // TODO: build navigation graph
}

ชอบ NavHost Composable, ต้องใช้การอ้างอิงตัวควบคุมนำทาง เส้นทางสำหรับการเริ่มต้น ปลายทาง และเครื่องมือสร้าง สำหรับกราฟการนำทางซึ่งแสดงเป็น ตามหลัง lambda

ต้องระบุปลายทางเริ่มต้นในเครื่องมือสร้างกราฟการนำทาง กับจุดหมายอื่นๆ ทั้งหมดที่ควรจะใช้การนำทางได้ 

val navController = rememberSwipeDismissableNavController()
SwipeDismissableNavHost(
    navController = navController,
    startDestination = "message_list"
) {
    composable("message_list") {
        MessageList(onMessageClick = { id ->
            navController.navigate("message_detail/$id")
        })
    }
    composable("message_detail/{id}") {
        MessageDetail(id = it.arguments?.getString("id")!!)
    }
}
Navigation.kt

หากต้องการเรียนรู้เพิ่มเติมเกี่ยวกับการนำทางของ Jetpack โปรดดู การนำทางด้วยการเขียนหรือใช้ ห้องทดลองโค้ดการนำทางของ Jetpack Compose