Thành phần điều hướng trong Android Jetpack hỗ trợ các ứng dụng sử dụng công cụ Jetpack Compose. Bạn có thể di chuyển giữa các thành phần kết hợp (composable) trong khi tận dụng cơ sở hạ tầng và các tính năng của thành phần Điều hướng.
Trang này mô tả sự khác biệt với Jetpack Navigation trong Compose cho Wear OS.
Thiết lập
Sử dụng phần phụ thuộc sau trong tệp build.gradle của mô-đun ứng dụng:
Kotlin
dependencies {
def wear_compose_version = "1.3.1"
implementation "androidx.wear.compose:compose-navigation:$wear_compose_version"
}
Tệp này được dùng thay thế cho cấu phần phần mềm androidx.navigation:navigation-compose vì tệp này cung cấp các phương thức triển khai thay thế dành riêng cho Wear OS.
Tạo bộ điều khiển, bộ lưu trữ và biểu đồ để điều hướng
Tính năng điều hướng bằng Compose cho Wear OS yêu cầu 3 thành phần giống nhau cần có trên các ứng dụng không phải Wear OS: bộ điều khiển, bộ lưu trữ và biểu đồ điều hướng.
Sử dụng rememberSwipeDismissableNavController() để tạo một thực thể của WearNavigator, một phương thức triển khai NavController phù hợp với các ứng dụng Wear OS:
Kotlin
val navController = rememberSwipeDismissableNavController()
NavController là API chính dùng để di chuyển trong các ứng dụng sử dụng công cụ Compose. Thành phần này kiểm soát việc điều hướng các thành phần kết hợp trong bộ lưu trữ điều hướng trên Wear OS là SwipeDismissableNavHost.
Kotlin
val navController = rememberSwipeDismissableNavController()
SwipeDismissableNavHost(
navController = navController,
startDestination = "message_list"
) {
// TODO: build navigation graph
}
Giống như thành phần kết hợp NavHost, thành phần này tham chiếu đến bộ điều khiển điều hướng, tuyến đường cho đích bắt đầu và trình tạo biểu đồ điều hướng hiển thị dưới dạng trailing lambda (lambda theo sau).
Bạn phải cung cấp đích bắt đầu trong trình tạo biểu đồ điều hướng, cùng với mọi đích đến khác có thể điều hướng được bằng bộ điều khiển điều hướng.
Kotlin
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")!!)
}
}
Để tìm hiểu thêm về Điều hướng Jetpack, hãy xem phần Điều hướng bằng Compose hoặc tham gia Lớp học lập trình về Điều hướng trong Jetpack Compose.