नेविगेशन कंपोज़ एपीआई की मदद से, एक से ज़्यादा कंपोज़ेबल में नेविगेट किया जा सकता है ऐप्लिकेशन कंपोज़ करें और Jetpack नेविगेशन के कॉम्पोनेंट इस्तेमाल करते हुए, बुनियादी सुविधाओं, और सुविधाओं के बारे में बात करते हैं.
इस पेज में बताया गया है कि फ़्रैगमेंट पर आधारित जेटपैक नेविगेशन से कैसे नेविगेशन कंपोज़िशन, जेटपैक पर व्यू-आधारित यूज़र इंटरफ़ेस (यूआई) माइग्रेशन के हिस्से के तौर पर लिखें.
माइग्रेशन से जुड़ी ज़रूरी शर्तें
अगर आप कोई विकल्प चुनने के बाद सभी कीवर्ड को बदलना चाहते हैं, तो नेविगेशन कंपोज़िशन पर माइग्रेट कर सकते हैं स्क्रीन कंपोज़ेबल से जुड़े फ़्रैगमेंट. स्क्रीन कंपोज़ेबल में ये चीज़ें शामिल हो सकती हैं लिखें और देखें कॉन्टेंट का मिक्स, लेकिन सभी नेविगेशन डेस्टिनेशन कंपोज़ेबल का इस्तेमाल करें. तब तक, आपको अपने इंटरऑप व्यू में फ़्रैगमेंट पर आधारित नेविगेशन कॉम्पोनेंट का इस्तेमाल जारी रखें और कोड बेस लिखें. ज़्यादा जानकारी के लिए, नेविगेशन इंटरऑप दस्तावेज़ देखें जानकारी.
सिर्फ़-लिखने के लिए ऐप्लिकेशन में नेविगेशन कंपोज़ का इस्तेमाल करना एक ज़रूरी शर्त नहीं है. आप फ़्रैगमेंट-आधारित नेविगेशन कॉम्पोनेंट का इस्तेमाल करना जारी रखें, जब तक कि आपके कंपोज़ेबल कॉन्टेंट को होस्ट करने के लिए फ़्रैगमेंट.
माइग्रेशन का तरीका
चाहे आप हमारी सुझाई गई माइग्रेशन रणनीति का पालन कर रहे हों या दूसरा तरीका है, तो आप एक ऐसे बिंदु पर पहुंच जाएंगे, जहां सभी नेविगेशन डेस्टिनेशन स्क्रीन कंपोज़ेबल, जिसमें फ़्रैगमेंट सिर्फ़ कंपोज़ेबल कंटेनर के तौर पर काम करते हैं. इस पर स्टेज, नेविगेशन कंपोज़ पर माइग्रेट किया जा सकता है.
अगर आपका ऐप्लिकेशन पहले से ही यूडीएफ़ डिज़ाइन पैटर्न का पालन करता है और हमारी गाइड आर्किटेक्चर का इस्तेमाल करते हैं, तो Jetpack Compose और नेविगेशन कंपोज़ में माइग्रेट नहीं किया जाना चाहिए के लिए यूज़र इंटरफ़ेस (यूआई) लेयर के अलावा, आपके ऐप्लिकेशन की अन्य लेयर की बड़ी रीफ़ैक्टरिंग की ज़रूरत होती है.
नेविगेशन कंपोज़ पर माइग्रेट करने के लिए, यह तरीका अपनाएं:
- अपने ऐप्लिकेशन में, नेविगेशन कंपोज़ डिपेंडेंसी जोड़ें.
कोई
App-level
कंपोज़ेबल बनाएं और इसे अपनेActivity
में अपने व्यू लेआउट के सेटअप को बदलते हुए, एंट्री पॉइंट लिखें:class SampleActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) // setContentView<ActivitySampleBinding>(this, R.layout.activity_sample) setContent { SampleApp(/* ... */) } } }
हर नेविगेशन डेस्टिनेशन के लिए टाइप बनाएं. इसके लिए
data object
का इस्तेमाल करें ऐसे डेस्टिनेशन जिनके लिए किसी डेटा औरdata class
याclass
की ज़रूरत नहीं होती जिनके लिए डेटा ज़रूरी है.@Serializable data object First @Serializable data class Second(val id: String) @Serializable data object Third
NavController
को ऐसी जगह सेट अप करें जहां सभी कंपोज़ेबल को उसे ऐक्सेस करने की अनुमति देने के लिए (आम तौर पर, यह आपकेApp
के अंदर होता है कंपोज़ेबल). यह तरीका राज्य को बढ़ाने के सिद्धांतों का पालन करता है साथ ही, यह आपको इन कामों के लिएNavController
को सोर्स के तौर पर इस्तेमाल करने की अनुमति देता है कंपोज़ेबल स्क्रीन के बीच नेविगेट करना और पिछली गतिविधियों का रखरखाव करना:@Composable fun SampleApp() { val navController = rememberNavController() // ... }
App
कंपोज़ेबल में अपने ऐप्लिकेशन काNavHost
बनाएं औरnavController
:@Composable fun SampleApp() { val navController = rememberNavController() SampleNavHost(navController = navController) } @Composable fun SampleNavHost( navController: NavHostController ) { NavHost(navController = navController, startDestination = First) { // ... } }
अपना नेविगेशन ग्राफ़ बनाने के लिए,
composable
डेस्टिनेशन जोड़ें. अगर हर स्क्रीन को पहले ही Compose में माइग्रेट किया जा चुका है. इस चरण में सिर्फ़ यह जानकारी शामिल है इन स्क्रीन कंपोज़ेबल को आपके फ़्रैगमेंट से,composable
गंतव्य:class FirstFragment : Fragment() { override fun onCreateView( inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle? ): View { return ComposeView(requireContext()).apply { setContent { // FirstScreen(...) EXTRACT FROM HERE } } } } @Composable fun SampleNavHost( navController: NavHostController ) { NavHost(navController = navController, startDestination = First) { composable<First> { FirstScreen(/* ... */) // EXTRACT TO HERE } composable<Second> { SecondScreen(/* ... */) } // ... } }
अगर आपने Compose के यूज़र इंटरफ़ेस (यूआई) को संग्रहित करने से जुड़े निर्देशों का पालन किया है, खास तौर पर,
ViewModel
s और नेविगेशन इवेंट को कंपोज़ेबल. इसके बाद, अगले चरण के तौर पर यह बदलना है किViewModel
कैसे उपलब्ध कराया जाए लिखने के लिए डिज़ाइन किया जा सकता है. Hilt इंजेक्शन और इसके इंटिग्रेशन का इस्तेमाल किया जा सकता हैhiltViewModel
के ज़रिए लिखें और नेविगेशन का इस्तेमाल करके पॉइंट करें:@Composable fun FirstScreen( // viewModel: FirstViewModel = viewModel(), viewModel: FirstViewModel = hiltViewModel(), onButtonClick: () -> Unit = {}, ) { // ... }
सभी
findNavController()
नेविगेशन कॉल कोnavController
से बदलें और उन्हें नेविगेशन इवेंट के तौर पर, हर कंपोज़ेबल स्क्रीन पर पास किया जा सकता है. पूरेnavController
को पास करने से बेहतर है. यह तरीका अपनाने के सबसे सही तरीके कंपोज़ेबल फ़ंक्शन से लेकर कॉलर और सबसे अहम सोर्स के तौर परnavController
को सेव रखता है.रूट का इंस्टेंस बनाकर, किसी डेस्टिनेशन को डेटा भेजा जा सकता है क्लास का इस्तेमाल करें. इसके बाद, इसे सीधे हासिल किया जा सकता है डेस्टिनेशन पर बैक स्टैक एंट्री से या इसका इस्तेमाल करके
ViewModel
SavedStateHandle.toRoute()
.@Composable fun SampleNavHost( navController: NavHostController ) { NavHost(navController = navController, startDestination = First) { composable<First> { FirstScreen( onButtonClick = { // findNavController().navigate(firstScreenToSecondScreenAction) navController.navigate(Second(id = "ABC")) } ) } composable<Second> { backStackEntry -> val secondRoute = backStackEntry.toRoute<Second>() SecondScreen( id = secondRoute.id, onIconClick = { // findNavController().navigate(secondScreenToThirdScreenAction) navController.navigate(Third) } ) } // ... } }
सभी फ़्रैगमेंट, काम के एक्सएमएल लेआउट, गै़र-ज़रूरी नेविगेशन वगैरह हटाएं संसाधन, और पुराना फ़्रैगमेंट और Jetpack नेविगेशन डिपेंडेंसी.
नेविगेशन कंपोज़ की सुविधा से जुड़ी ज़्यादा जानकारी के साथ, ऐसे ही चरण यहां देखे जा सकते हैं: सेटअप से जुड़े दस्तावेज़.
इस्तेमाल के सामान्य उदाहरण
इससे कोई फ़र्क नहीं पड़ता कि आप किस नेविगेशन घटक का उपयोग कर रहे हैं, नेविगेशन लागू होता है.
माइग्रेट करते समय, आम तौर पर इन उदाहरणों का इस्तेमाल किया जाता है:
- कंपोज़ेबल (कंपोज़ेबल) पर जाना
- तर्क की मदद से नेविगेट करना
- डीप लिंक
- नेस्ट किया गया नेविगेशन
- सबसे नीचे वाले नेविगेशन बार के साथ इंटिग्रेशन
- कस्टम नेविगेशन कॉम्पोनेंट के साथ इंटिग्रेशन
इन उपयोग के उदाहरणों के बारे में अधिक विस्तृत जानकारी के लिए, इसके साथ नेविगेट करना देखें लिखें.
नेविगेट करते समय जटिल डेटा वापस पाएं
हमारा सुझाव है कि नेविगेट करते समय, जटिल डेटा ऑब्जेक्ट को पास न करें. इसके बजाय, कम से कम ज़रूरी जानकारी पास करें. जैसे, यूनीक आइडेंटिफ़ायर या का इस्तेमाल करें. आपको ऐसा करना चाहिए जटिल ऑब्जेक्ट को डेटा के रूप में एक ही जगह पर स्टोर करते हैं, जैसे कि डेटा लेयर. अधिक जानकारी के लिए, जब जटिल डेटा को पुनर्प्राप्त करना हो नेविगेट करना.
अगर आपके फ़्रैगमेंट, कॉम्प्लेक्स ऑब्जेक्ट को आर्ग्युमेंट के तौर पर पास कर रहे हैं, तो रीफ़ैक्टरिंग करें अपने कोड को पहले इस तरह से सेट करें कि को ट्रैक किया जा सकता है. अब Android डेटा स्टोर करने की जगह में देखें उदाहरण.
सीमाएं
इस सेक्शन में, नेविगेशन कंपोज़ की मौजूदा सीमाओं के बारे में बताया गया है.
नेविगेशन कंपोज़ की सुविधा पर इंक्रीमेंटल माइग्रेशन
फ़िलहाल, आप फ़्रैगमेंट का इस्तेमाल इस रूप में करते हुए नेविगेशन कंपोज़ की सुविधा का इस्तेमाल नहीं कर सकते: गंतव्यों को शामिल करें. मार्गदर्शक लिखें का उपयोग करना प्रारंभ करने के लिए, अपने सभी डेस्टिनेशन, कंपोज़ेबल होने चाहिए. आप इस सुविधा के अनुरोध को समस्या को ट्रैक करने वाला टूल.
ट्रांज़िशन ऐनिमेशन
नेविगेशन 2.7.0-alpha01 से शुरू होने वाली सुविधा, कस्टम सेटिंग के लिए सहायता
ट्रांज़िशन हैं, जो पहले AnimatedNavHost
से थे, अब
यह सुविधा NavHost
में सीधे तौर पर काम करती है. इनके लिए प्रॉडक्ट की जानकारी पढ़ें
ज़्यादा जानकारी देखें.
ज़्यादा जानें
नेविगेशन कंपोज़ पर माइग्रेट करने के बारे में ज़्यादा जानकारी के लिए, यह देखें संसाधन:
- नेविगेशन कंपोज़ कोडलैब: नेविगेशन कंपोज़ की बुनियादी बातें जानें के साथ कोडलैब का इस्तेमाल कर सकते हैं.
- अब Android डेटा स्टोर करने की जगह में: पूरी तरह से काम करने वाला Android ऐप्लिकेशन इसे पूरी तरह से Kotlin और Jetpack Compose के साथ बनाया गया है, जो Android के डिज़ाइन को फ़ॉलो करते हैं साथ ही, नेविगेशन कंपोज़ की सुविधा भी शामिल है.
- Sunflower को Jetpack Compose में माइग्रेट करना: एक ब्लॉग पोस्ट Sunflower सैंपल ऐप्लिकेशन के माइग्रेशन की प्रोसेस को, व्यू से लेकर Compose में, नेविगेशन कंपोज़ पर माइग्रेट करने की सुविधा भी शामिल है.
- हर स्क्रीन के लिए Jeetnews: एक ब्लॉग पोस्ट, जिसमें सभी स्क्रीन पर काम करने के लिए, Jetnews सैंपल की रीफ़ैक्टरिंग और माइग्रेशन Jetpack Compose और नेविगेशन कंपोज़.
आपके लिए सुझाव
- ध्यान दें: JavaScript बंद होने पर लिंक टेक्स्ट दिखता है
- Compose की मदद से नेविगेट करना
- लिखें और अन्य लाइब्रेरी
- ध्यान देने वाली अन्य बातें