ניווט באמצעות 'כתיבה' ב-Wear OS


רכיב הניווט ב-Android Jetpack מספק תמיכה באפליקציות של Jetpack פיתוח נייטיב. אתם יכולים לנווט בין רכיבים מורכבים תוך ניצול התשתית והתכונות של רכיב הניווט.

בדף הזה מתוארים ההבדלים ביחס ל-Jetpack Navigation ב-Compose ל-Wear OS.

הגדרה

משתמשים ביחס התלות הבא בקובץ build.gradle של מודול האפליקציה:

Kotlin

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

משתמשים בו במקום הארטיפקט androidx.navigation:navigation-compose כי הוא מספק הטמעות חלופיות שספציפיות ל-Wear OS.

יצירת רכיבי ניווט, מארח וגרף

כדי לנווט באמצעות Compose ל-Wear OS, נדרשים אותם שלושה רכיבים שנדרשים באפליקציות שאינן ל-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, הוא מקבל הפניה למסוף הניווט, למסלול ליעד ההתחלה ול-builder של תרשים הניווט, שמוצג כאן כ-lambda נלווה.

צריך לספק את יעד ההתחלה ב-builder של תרשים הניווט, יחד עם כל יעדי היעד האחרים שצריך לאפשר ניווט אליהם באמצעות בקר הניווט.

באפליקציה ל-Wear OS, מגדירים את SwipeDismissableNavHost כתוכן של AppScaffold כדי לתמוך ברכיבים ברמה העליונה, כמו שעון, אינדיקטור גלילה/מיקום ואינדיקטור דף. כדי להוסיף אובייקט TimeText למסך כברירת מחדל ולוודא שהאנימציה שלו פועלת כמו שצריך כשמנווטים בין המסכים, אפשר להשתמש באובייקט AppScaffold מעל SwipeDismissableNavHost ו-ScreenScaffold ברמת המסך. בנוסף, ScreenScaffold מוסיף PositionIndicator לתוכן שאפשר לגלול בו.
    AppScaffold {
        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")!!)
            }
        }
    }
}

// Implementation of one of the screens in the navigation
@Composable
fun MessageDetail(id: String) {
    // .. Screen level content goes here
    val scrollState = rememberTransformingLazyColumnState()

    val padding = rememberResponsiveColumnPadding(
        first = ColumnItemType.BodyText
    )

    ScreenScaffold(
        scrollState = scrollState,
        contentPadding = padding
    ) {
        // Screen content goes here

למידע נוסף על ניווט ב-Jetpack פיתוח נייטיב, אפשר לעיין במאמר ניווט באמצעות Compose או להשתתף בסדנת הקוד בנושא ניווט ב-Jetpack פיתוח נייטיב.