सबसे ऊपर मौजूद ऐप्लिकेशन बार से नेविगेट करें

इस गाइड में बताया गया है कि टॉप ऐप्लिकेशन बार में मौजूद नेविगेशन आइकॉन को नेविगेशन ऐक्शन करने के लिए कैसे सेट किया जा सकता है.

उदाहरण

नीचे दिए गए स्निपेट में, काम करने वाले नेविगेशन आइकॉन के साथ टॉप ऐप्लिकेशन बार को लागू करने का तरीका बताया गया है. इस मामले में, आइकॉन उपयोगकर्ता को ऐप्लिकेशन में उसके पिछले डेस्टिनेशन पर ले जाता है:

@Composable
fun TopBarNavigationExample(
    navigateBack: () -> Unit,
) {
    Scaffold(
        topBar = {
            CenterAlignedTopAppBar(
                title = {
                    Text(
                        "Navigation example",
                    )
                },
                navigationIcon = {
                    IconButton(onClick = navigateBack) {
                        Icon(
                            imageVector = Icons.AutoMirrored.Filled.ArrowBack,
                            contentDescription = "Localized description"
                        )
                    }
                },
            )
        },
    ) { innerPadding ->
        Text(
            "Click the back button to pop from the back stack.",
            modifier = Modifier.padding(innerPadding),
        )
    }
}

कोड के बारे में अहम जानकारी

इस उदाहरण में इन बातों का ध्यान रखें:

  • कंपोज करने लायक TopBarNavigationExample, () -> Unit टाइप के पैरामीटर navigateBack के बारे में बताता है.
  • यह CenterAlignedTopAppBar के navigationIcon पैरामीटर के लिए navigateBack पास करता है.

इसलिए, जब भी उपयोगकर्ता सबसे ऊपर मौजूद ऐप्लिकेशन के बैक बटन में नेविगेशन आइकॉन पर क्लिक करता है, तो यह navigateBack() को कॉल करता है.

फ़ंक्शन पास करना

इस उदाहरण में, आइकॉन के लिए बैक ऐरो का इस्तेमाल किया गया है. इसलिए, navigateBack() के लिए आर्ग्युमेंट, उपयोगकर्ता को पिछले डेस्टिनेशन पर ले जाना चाहिए.

ऐसा करने के लिए, TopBarNavigationExample को NavController.popBackStack() पर कॉल पास करें. ऐसा तब किया जाता है, जब नेविगेशन ग्राफ़ बनाया जाता है. उदाहरण के लिए:

NavHost(navController, startDestination = "home") {
    composable("topBarNavigationExample") {
        TopBarNavigationExample{ navController.popBackStack() }
    }
    // Other destinations...

अन्य संसाधन

अपने ऐप्लिकेशन में नेविगेशन लागू करने के तरीके के बारे में ज़्यादा जानने के लिए, यहां दी गई गाइड की सीरीज़ देखें: