RecyclerView হল একটি ভিউ কম্পোনেন্ট যা ডেটার বড় সেট
দক্ষতার সাথে প্রদর্শন করা সহজ করে তোলে। ডেটা সেটের প্রতিটি আইটেমের জন্য ভিউ তৈরি করার পরিবর্তে,
RecyclerView ভিউয়ের একটি ছোট পুল রেখে এবং আপনি সেই আইটেমগুলি স্ক্রোল করার সাথে সাথে সেগুলির মাধ্যমে রিসাইকেল করে আপনার অ্যাপের পারফর্ম্যান্স উন্নত করে।
Compose-এ, একই কাজ করার জন্য আপনি Lazy তালিকা ব্যবহার করতে পারেন। Compose-এ Lazy তালিকা ব্যবহার করার জন্য
কীভাবে আপনার RecyclerView ইমপ্লিমেন্টেশন মাইগ্রেট করবেন
তা এই পৃষ্ঠায় বর্ণনা করা হয়েছে।
মাইগ্রেশনের ধাপ
Compose-এ আপনার RecyclerView ইমপ্লিমেন্টেশন মাইগ্রেট করতে, এই ধাপগুলি অনুসরণ করুন:
আপনার UI হায়ারার্কি থেকে
RecyclerViewকমেন্ট আউট করুন বা সরান এবং এটি প্রতিস্থাপন করতে একটিComposeViewযোগ করুন যদি হায়ারার্কিতে এখনও কেউ উপস্থিত না থাকে। এটি হল Lazy তালিকার কন্টেনার যা আপনি যোগ করবেন:<FrameLayout android:layout_width="match_parent" android:layout_height="match_parent"> <!-- <androidx.recyclerview.widget.RecyclerView--> <!-- android:id="@+id/recycler_view"--> <!-- android:layout_width="match_parent"--> <!-- android:layout_height="match_parent />"--> <androidx.compose.ui.platform.ComposeView android:id="@+id/compose_view" android:layout_width="match_parent" android:layout_height="match_parent" /> </FrameLayout>আপনার
RecyclerView-এর লেআউট ম্যানেজারের উপর ভিত্তি করে আপনার কোন ধরনের লেজি লিস্ট কম্পোজেবল প্রয়োজন তা নির্ধারণ করুন (নিচের টেবিল দেখুন)। আপনার বেছে নেওয়া কম্পোজেবলটি আগের ধাপে যোগ করাComposeView-এর টপ-লেভেল কম্পোজেবল হবে।LayoutManagerকম্পোজেবল
LinearLayoutManagerLazyColumnবাLazyRowGridLayoutManagerLazyVerticalGridবাLazyHorizontalGridStaggeredGridLayoutManagerLazyVerticalStaggeredGridবাLazyHorizontalStaggeredGrid// recyclerView.layoutManager = LinearLayoutManager(context) composeView.setContent { LazyColumn(Modifier.fillMaxSize()) { // We use a LazyColumn since the layout manager of the RecyclerView is a vertical LinearLayoutManager } }
আপনার
RecyclerView.Adapterইমপ্লিমেন্টেশনে প্রতিটি ভিউ টাইপের জন্য একটি সংশ্লিষ্ট কম্পোজেবল তৈরি করুন। প্রতিটি ভিউ টাইপ সাধারণত একটিViewHolderসাবক্লাসে ম্যাপ করে, যদিও এটি সবসময় নাও হতে পারে। এইসব কম্পোজেবল আপনার তালিকার বিভিন্ন ধরনের এলিমেন্টের জন্য UI রিপ্রেজেন্টেশন হিসেবে ব্যবহার করা হবে:@Composable fun ListItem(data: MyData, modifier: Modifier = Modifier) { Row(modifier.fillMaxWidth()) { Text(text = data.name) // … other composables required for displaying `data` } }
আপনার
RecyclerView.Adapter-এরonCreateViewHolder()এবংonBindViewHolder()মেথডের লজিক এইসব কম্পোজেবল এবং আপনি যে স্টেট প্রদান করেন তার দ্বারা প্রতিস্থাপিত হবে। Compose-এ, কোনও আইটেমের জন্য কম্পোজেবল তৈরি করা এবং এতে ডেটা বাইন্ড করার মধ্যে কোনও পার্থক্য নেই—এই ধারণাগুলি একত্রিত করা হয়েছে।লেজি তালিকার
contentস্লটের মধ্যে (ট্রেলিং ল্যাম্বডা প্যারামিটার), আপনার তালিকার ডেটা ইটারেট করতেitems()ফাংশন (বা সমতুল্য ওভারলোড) ব্যবহার করুন।itemContentল্যাম্বডাতে, আপনার ডেটার জন্য উপযুক্ত কম্পোজেবল আইটেম ইনভোক করুন:val data = listOf<MyData>(/* ... */) composeView.setContent { LazyColumn(Modifier.fillMaxSize()) { items(data) { ListItem(it) } } }
সাধারণ ব্যবহারিক ক্ষেত্র
আইটেম সজ্জা
RecyclerView-এ ItemDecoration-এর ধারণা আছে, যা আপনি তালিকার আইটেমের জন্য বিশেষ ড্রয়িং যোগ করতে ব্যবহার করতে পারেন। যেমন, আইটেমের মধ্যে ডিভাইডার যোগ করতে আপনি
ItemDecoration যোগ করতে পারেন:
val itemDecoration = DividerItemDecoration(recyclerView.context, LinearLayoutManager.VERTICAL) recyclerView.addItemDecoration(itemDecoration)
Compose-এ আইটেম ডেকোরেশনের সমতুল্য কোনও ধারণা নেই। পরিবর্তে, আপনি
কম্পোজিশনে সরাসরি তালিকায় যেকোনও UI ডেকোরেশন যোগ করতে পারবেন। যেমন,
তালিকায় ডিভাইডার যোগ করতে, প্রতিটি আইটেমের পরে আপনি Divider কম্পোজেবল
ব্যবহার করতে পারেন:
LazyColumn(Modifier.fillMaxSize()) { itemsIndexed(data) { index, d -> ListItem(d) if (index != data.size - 1) { HorizontalDivider() } } }
আইটেম অ্যানিমেশন
অ্যাডাপ্টারে পরিবর্তন করা হলে আইটেমের উপস্থিতি অ্যানিমেট করার জন্য RecyclerView-এ ItemAnimator সেট করা যেতে পারে। ডিফল্ট হিসেবে, RecyclerView
DefaultItemAnimator ব্যবহার করে যা ইভেন্ট সরানো, যোগ করা ও সরানোর সময় বেসিক অ্যানিমেশন প্রদান করে।
animateItemPlacement মডিফায়ারের মাধ্যমে লেজি লিস্টের একই ধরনের কনসেপ্ট আছে।
আরও জানতে আইটেম অ্যানিমেশন দেখুন।
অতিরিক্ত রিসোর্স
Compose-এ RecyclerView মাইগ্রেট করার ব্যাপারে আরও তথ্যের জন্য, নিম্নলিখিত রিসোর্স দেখুন:
- তালিকা ও গ্রিড: Compose-এ কীভাবে তালিকা ও গ্রিড প্রয়োগ করতে হয় সেই সংক্রান্ত ডকুমেন্টেশন।
- Jetpack Compose ইন্টারঅপারেবিলিটি: RecyclerView-এ Compose ব্যবহার করা:
RecyclerView-এর মধ্যে Compose দক্ষতার সাথে ব্যবহার করার জন্য ব্লগ পোস্ট।
আপনার জন্য সাজেস্ট করা হয়েছে
- মনে রাখবেন: জাভাস্ক্রিপ্ট বন্ধ থাকলে লিঙ্ক টেক্সট দেখানো হয়
- তালিকা ও গ্রিড
- Compose-এ
CoordinatorLayoutমাইগ্রেট করা - অন্যান্য বিষয়