নেভিগেশন রেল

রেল, বড় স্ক্রিনযুক্ত ডিভাইসে রান করা অ্যাপের গন্তব্যে অ্যাক্সেস প্রদান করে। আপনাকে নিম্নলিখিত ক্ষেত্রে নেভিগেশন রেল ব্যবহার করতে হবে:

• অ্যাপের যেকোনও জায়গা থেকে অ্যাক্সেস করা যায় এমন টপ-লেভেল গন্তব্য
• তিন থেকে সাতটি প্রধান গন্তব্য
• ট্যাবলেট বা ডেস্কটপ লেআউট

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

API সারফেস

আপনার অ্যাপ্লিকেশনে রেল প্রয়োগ করতে NavigationRailItem-এর সাথে NavigationRail কম্পোজেবল ব্যবহার করুন। NavigationRailItem-এর মাধ্যমে রেল কলামে একটি রেল আইটেমকে বোঝানো হয়।

NavigationRailItem-এ নিম্নলিখিত মূল প্যারামিটারগুলি অন্তর্ভুক্ত থাকে:

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

উদাহরণ: রেল-ভিত্তিক নেভিগেশন

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

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

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

Key points

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

ফলাফল

নিচের ছবিতে আগের স্নিপেটের ফলাফল দেখানো হয়েছে:

অতিরিক্ত রিসোর্স

• Material 3 - নেভিগেশন রেল
• Compose-এর সাহায্যে নেভিগেশন