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

নেভিগেশন বার ব্যবহারকারীদের একটি অ্যাপের মধ্যে বিভিন্ন গন্তব্যের মধ্যে পরিবর্তন করতে সাহায্য করে। নিম্নলিখিত ক্ষেত্রগুলিতে আপনার নেভিগেশন বার ব্যবহার করা উচিত:

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

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

এপিআই পৃষ্ঠ

গন্তব্য পরিবর্তনের লজিক বাস্তবায়নের জন্য 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) } নির্বাচিত আইটেমের অবস্থা পরিচালনা করে।
  • startDestination.ordinal Destination.SONGS enum এন্ট্রির সাংখ্যিক সূচক (অবস্থান) প্রদান করে।
• যখন কোনো আইটেমে ক্লিক করা হয়, তখন সংশ্লিষ্ট স্ক্রিনে যাওয়ার জন্য navController.navigate(route = destination.route) কল করা হয়।
• NavigationBarItem এর onClick ল্যাম্বডাটি selectedDestination স্টেট আপডেট করে ক্লিক করা আইটেমটিকে দৃশ্যমানভাবে হাইলাইট করে।
• নির্বাচিত স্ক্রিনের প্রকৃত বিষয়বস্তু প্রদর্শন করার জন্য, ন্যাভিগেশন লজিকটি navController এবং startDestination পাস করে AppNavHost কম্পোজেবলকে কল করে।

ফলাফল

নিচের ছবিতে পূর্ববর্তী কোড স্নিপেটটির ফলে তৈরি হওয়া নেভিগেশন বারটি দেখানো হয়েছে:

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

• উপাদান ৩ - নেভিগেশন বার
• কম্পোজ দিয়ে নেভিগেশন