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

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

उदाहरण

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

@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() के लिए आर्ग्युमेंट, उपयोगकर्ता को पिछले डेस्टिनेशन पर ले जाना चाहिए.

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

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

अन्य संसाधन

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