Android Jetpack में मौजूद Navigation component, Jetpack Compose ऐप्लिकेशन के लिए सहायता उपलब्ध कराता है. नेविगेशन कॉम्पोनेंट के इन्फ़्रास्ट्रक्चर और सुविधाओं का फ़ायदा उठाते हुए, कंपोज़ेबल के बीच नेविगेट किया जा सकता है.
इस पेज पर, Compose for Wear OS पर Jetpack Navigation के साथ काम करने वाले फ़र्क़ के बारे में बताया गया है.
सेटअप
अपने ऐप्लिकेशन मॉड्यूल की build.gradle फ़ाइल में, इस डिपेंडेंसी का इस्तेमाल करें:
Kotlin
dependencies { def wear_compose_version = "1.6.2" implementation "androidx.wear.compose:compose-navigation:$wear_compose_version" }
इसका इस्तेमाल androidx.navigation:navigation-compose आर्टफ़ैक्ट के बदले किया जाता है, क्योंकि यह Wear OS के लिए खास तौर पर बनाए गए विकल्प उपलब्ध कराता है.
नेविगेशन कंट्रोलर, होस्ट, और ग्राफ़ बनाना
Wear OS के लिए Compose का इस्तेमाल करके नेविगेट करने के लिए, वही तीन कॉम्पोनेंट ज़रूरी होते हैं जो Wear OS के अलावा अन्य ऐप्लिकेशन के लिए ज़रूरी होते हैं: नेविगेशन कंट्रोलर, होस्ट, और ग्राफ़.
WearNavigator का इंस्टेंस बनाने के लिए, rememberSwipeDismissableNavController() का इस्तेमाल करें. यह NavController को लागू करने का एक तरीका है, जो Wear OS ऐप्लिकेशन के लिए सही है:
val navController = rememberSwipeDismissableNavController()
NavController, Compose ऐप्लिकेशन में नेविगेट करने के लिए इस्तेमाल किया जाने वाला मुख्य एपीआई है. यह नेविगेशन होस्ट में कंपोज़ेबल के बीच नेविगेट करने की सुविधा को कंट्रोल करता है. Wear OS पर, यह SwipeDismissableNavHost होता है.
val navController = rememberSwipeDismissableNavController() SwipeDismissableNavHost( navController = navController, startDestination = "message_list" ) { // TODO: build navigation graph }
NavHost कंपोज़ेबल की तरह, यह नेविगेशन कंट्रोलर, शुरुआती डेस्टिनेशन के लिए रूट, और नेविगेशन ग्राफ़ के लिए बिल्डर का रेफ़रंस लेता है. इसे यहां ट्रेलिंग लैम्ब्डा के तौर पर दिखाया गया है.
नेविगेशन ग्राफ़ बिल्डर में, शुरुआती डेस्टिनेशन की जानकारी देनी होगी. साथ ही, उन सभी डेस्टिनेशन की जानकारी भी देनी होगी जिन पर नेविगेशन कंट्रोलर की मदद से नेविगेट किया जा सकता है.
अपने Wear OS ऐप्लिकेशन में,SwipeDismissableNavHost को AppScaffold के कॉन्टेंट के तौर पर एलान करें, ताकि समय, स्क्रोल या पोज़िशन इंडिकेटर, और पेज इंडिकेटर जैसे टॉप-लेवल कॉम्पोनेंट काम कर सकें.
स्क्रीन लेवल पर SwipeDismissableNavHost और ScreenScaffold के ऊपर AppScaffold ऑब्जेक्ट का इस्तेमाल करें. इससे स्क्रीन पर डिफ़ॉल्ट रूप से TimeText ऑब्जेक्ट जोड़ा जा सकेगा. साथ ही, यह पक्का किया जा सकेगा कि स्क्रीन के बीच नेविगेट करते समय, यह सही तरीके से ऐनिमेट हो.
इसके अलावा, 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 ) { scaffoldPaddingValues -> // Screen content goes here // ...
Jetpack Navigation के बारे में ज़्यादा जानने के लिए, Compose का इस्तेमाल करके नेविगेट करना लेख पढ़ें या Jetpack Compose Navigation कोड लैब में हिस्सा लें.
आपके लिए सुझाव
- ध्यान दें: JavaScript बंद होने पर लिंक का टेक्स्ट दिखता है
- Jetpack Navigation को Navigation Compose पर माइग्रेट करना
- Compose के साथ नेविगेशन
- Compose की मदद से, एक स्क्रीन से दूसरी स्क्रीन पर जाना