ন্যাভিগেশন বার

সেভ করা পৃষ্ঠা গুছিয়ে রাখতে 'সংগ্রহ' ব্যবহার করুন আপনার পছন্দ অনুযায়ী কন্টেন্ট সেভ করুন ও সঠিক বিভাগে রাখুন।

নেভিগেশন বার ব্যবহারকারীদের একটি অ্যাপে গন্তব্যের মধ্যে পরিবর্তন করতে দেয়। আপনি এর জন্য নেভিগেশন বার ব্যবহার করা উচিত:

• সমান গুরুত্বের তিন থেকে পাঁচটি গন্তব্য
• কমপ্যাক্ট উইন্ডো আকার
• অ্যাপ স্ক্রীন জুড়ে সামঞ্জস্যপূর্ণ গন্তব্য

এই পৃষ্ঠাটি আপনাকে দেখায় কিভাবে সম্পর্কিত স্ক্রীন এবং মৌলিক নেভিগেশন সহ আপনার অ্যাপে একটি নেভিগেশন বার প্রদর্শন করতে হয়।

API পৃষ্ঠ

গন্তব্য স্যুইচিং যুক্তি প্রয়োগ করতে NavigationBar এবং NavigationBarItem আইটেম কম্পোজেবল ব্যবহার করুন। প্রতিটি NavigationBarItem একটি একক গন্তব্য প্রতিনিধিত্ব করে।

NavigationBarItem নিম্নলিখিত কী পরামিতি অন্তর্ভুক্ত:

• selected : বর্তমান আইটেমটি দৃশ্যত হাইলাইট করা হয়েছে কিনা তা নির্ধারণ করে।
• onClick() : একটি প্রয়োজনীয় ল্যাম্বডা ফাংশন যা ব্যবহারকারী আইটেমটিতে ক্লিক করার সময় সঞ্চালিত ক্রিয়াকে সংজ্ঞায়িত করে। এখানেই আপনি সাধারণত নেভিগেশন ইভেন্টগুলি পরিচালনা করেন, নির্বাচিত আইটেমের অবস্থা আপডেট করেন বা সংশ্লিষ্ট সামগ্রী লোড করেন।
• label : আইটেমের মধ্যে পাঠ্য প্রদর্শন করে। ঐচ্ছিক।
• icon : আইটেমের মধ্যে একটি আইকন প্রদর্শন করে। ঐচ্ছিক।

উদাহরণ: নিচের নেভিগেশন বার

নিম্নলিখিত স্নিপেট আইটেমগুলির সাথে একটি নীচের নেভিগেশন বার প্রয়োগ করে যাতে ব্যবহারকারীরা একটি অ্যাপে বিভিন্ন স্ক্রিনের মধ্যে নেভিগেট করতে পারে:

@Composable
fun NavigationBarExample(modifier: Modifier = Modifier) {
    val navController = rememberNavController()
    val startDestination = Destination.SONGS
    var selectedDestination by rememberSaveable { mutableIntStateOf(startDestination.ordinal) }

    Scaffold(
        modifier = modifier,
        bottomBar = {
            NavigationBar(windowInsets = NavigationBarDefaults.windowInsets) {
                Destination.entries.forEachIndexed { index, destination ->
                    NavigationBarItem(
                        selected = selectedDestination == index,
                        onClick = {
                            navController.navigate(route = destination.route)
                            selectedDestination = index
                        },
                        icon = {
                            Icon(
                                destination.icon,
                                contentDescription = destination.contentDescription
                            )
                        },
                        label = { Text(destination.label) }
                    )
                }
            }
        }
    ) { contentPadding ->
        AppNavHost(navController, startDestination, modifier = Modifier.padding(contentPadding))
    }
}
Navigation.kt

মূল পয়েন্ট

• NavigationBar আইটেমগুলির একটি সংগ্রহ প্রদর্শন করে, প্রতিটি আইটেম একটি Destination সাথে সম্পর্কিত।
• val navController = rememberNavController() NavHostController এর একটি উদাহরণ তৈরি করে এবং মনে রাখে, যা একটি NavHost মধ্যে নেভিগেশন পরিচালনা করে।
• var selectedDestination by rememberSaveable { mutableIntStateOf(startDestination.ordinal) } বর্তমানে নির্বাচিত আইটেমের অবস্থা পরিচালনা করে।
• var selectedDestination by rememberSaveable { mutableIntStateOf(startDestination.ordinal) } বর্তমানে নির্বাচিত আইটেমের অবস্থা পরিচালনা করে।
  • startDestination.ordinal Destination.SONGS সংখ্যাসূচক সূচক (পজিশন) পায়।SONGS enum এন্ট্রি।
• যখন একটি আইটেম ক্লিক করা হয়, navController.navigate(route = destination.route) সংশ্লিষ্ট স্ক্রিনে নেভিগেট করতে বলা হয়।
• NavigationBarItem এর onClick lambda ক্লিক করা আইটেমটিকে দৃশ্যত হাইলাইট করতে selectedDestination অবস্থা আপডেট করে।
• এটি AppNavHost কম্পোজযোগ্য বলে, navController এবং startDestination পাস করে, নির্বাচিত স্ক্রিনের প্রকৃত বিষয়বস্তু প্রদর্শন করতে।

ফলাফল

নিম্নলিখিত চিত্রটি পূর্ববর্তী স্নিপেটের ফলে নেভিগেশন বার দেখায়:

অতিরিক্ত সম্পদ

• উপাদান 3 - নেভিগেশন বার
• রচনা সহ নেভিগেশন