Jetpack Compose এ LazyRow — এটি কী, বৈশিষ্ট্য এবং কিভাবে কাজ করে

Jetpack Compose এ LazyRow কী

LazyRow — একটি কম্পোজেবল ফাংশন যা উপাদানগুলির অলস লোডিং সহ একটি অনুভূমিক স্ক্রোলযোগ্য তালিকা প্রয়োগ করে। Row এর বিপরীতে, যা একসাথে সমস্ত চাইল্ড উপাদান রেন্ডার করে, LazyRow শুধুমাত্র দৃশ্যমান এলাকায় দৃশ্যমান উপাদান তৈরি করে।

LazyRow LazyColumn এর মতো একই নীতিতে কাজ করে, কিন্তু উপাদানগুলিকে অনুভূমিকভাবে সাজায়। বাম বা ডানে স্ক্রোল করার সময়, দৃশ্যমান এলাকা থেকে বেরিয়ে যাওয়া উপাদানগুলি নতুন উপাদান প্রদর্শনের জন্য পুনরায় ব্যবহার করা হয়। এটি অনেক ছবি সহ গ্যালারি বা দীর্ঘ ক্যাটাগরি তালিকার জন্য অত্যন্ত গুরুত্বপূর্ণ।

Android Developers Blog, 2024 অনুসারে, LazyRow LazyColumn এর মতো একই LazyList আর্কিটেকচার ব্যবহার করে, যার মধ্যে LazyListState, Pool এর মাধ্যমে পুনঃব্যবহার প্রক্রিয়া এবং বিভিন্ন উপাদান প্রকারের জন্য সমর্থন অন্তর্ভুক্ত। উপাদানগুলির নির্দিষ্ট উচ্চতার সাথে সর্বোচ্চ দক্ষতা অর্জন করা হয়।

LazyRow এর মৌলিক সিগনেচার

LazyRow প্যারামিটার modifier, state, contentPadding, reverseLayout, horizontalArrangement এবং verticalAlignment গ্রহণ করে। বিষয়বস্তু DSL ফাংশন items এবং item এর মাধ্যমে সংজ্ঞায়িত করা হয়, LazyColumn এর মতো।

@Composable
fun SimpleLazyRow() {
    val items = (1..50).toList()
    LazyRow(
        modifier = Modifier.fillMaxWidth().height(100.dp),
        horizontalArrangement = Arrangement.spacedBy(8.dp),
        contentPadding = PaddingValues(start = 16.dp, end = 16.dp)
    ) {
        items(items) { item ->
            Box(
                modifier = Modifier.size(80.dp).background(Color.Gray)
            ) {
                Text(text = "$item", modifier = Modifier.align(Alignment.Center))
            }
        }
    }
}

LazyRow এর বৈশিষ্ট্য: horizontalArrangement এবং contentPadding

horizontalArrangement LazyRow এর ভিতরে অনুভূমিক অক্ষ বরাবর উপাদানগুলির বিতরণ পরিচালনা করে। Row এর মতো একই Arrangement মান উপলব্ধ: Start, Center, End, SpaceBetween, SpaceEvenly, SpaceAround এবং কাস্টম স্পেসিং সহ spacedBy।

contentPadding LazyRow কন্টেইনারের কিনারায় প্যাডিং যোগ করে। Modifier.padding এর বিপরীতে, contentPadding স্ক্রোলিংয়ের সময় বিবেচনা করা হয়: প্রথম উপাদানের বাম কিনারা থেকে প্যাডিং থাকবে, শেষের ডান কিনারা থেকে। Material Design Guidelines, 2025 অনুসারে, ক্যারাউসেল এবং গ্যালারির জন্য contentPadding বাধ্যতামূলক যাতে প্রথম এবং শেষ উপাদান স্ক্রিনের কিনারায় লেগে না থাকে।

verticalAlignment LazyRow এর ভিতরে উপাদানগুলিকে উল্লম্বভাবে সারিবদ্ধ করে। ডিফল্টরূপে Alignment.Top ব্যবহার করা হয়। বিভিন্ন উচ্চতার উপাদানগুলিকে কেন্দ্রীভূত করতে Alignment.CenterVertically ব্যবহার করুন, যা বিভিন্ন অনুপাতের ছবি সহ ক্যারাউসেলের জন্য দরকারী।

LazyRow প্যারামিটার টেবিল

LazyListState এর সাথে অনুভূমিক স্ক্রোল পরিচালনা

LazyListState LazyRow এর জন্য LazyColumn এর মতোই কাজ করে: এটি প্রথম দৃশ্যমান উপাদান, অফসেট এবং সামগ্রিক স্ক্রোল অবস্থান ট্র্যাক করে। অবস্থাটি rememberLazyListState() এর মাধ্যমে তৈরি করা হয় এবং state প্যারামিটারে পাস করা হয়।

LazyRow এর প্রোগ্রামেটিক স্ক্রোল নিয়ন্ত্রণ একই পদ্ধতিতে করা হয়: মসৃণ অ্যানিমেশনের জন্য animateScrollToItem এবং তাৎক্ষণিক স্ক্রোলিংয়ের জন্য scrollToItem। উভয়ই একটি করুটিনের ভিতরে কল করা হয়। এটি বাম/ডান বোতাম সহ ক্যারাউসেল বা স্বয়ংক্রিয় স্ক্রোলিংয়ের জন্য দরকারী।

Android Developers, 2024 অনুসারে, LazyRow SnapFlingBehavior সমর্থন করে — দ্রুত স্ক্রোলিংয়ের জন্য আচরণ যা উপাদানগুলির মধ্যে না গিয়ে নিকটতম উপাদানে থামে। এটি ক্যারাউসেল এবং গ্যালারির জন্য একটি স্ন্যাপ প্রভাব তৈরি করে।

@Composable
fun CarouselWithSnap() {
    val listState = rememberLazyListState()
    val scope = rememberCoroutineScope()
    val items = listOf("A", "B", "C", "D", "E")

    Column {
        LazyRow(
            state = listState,
            flingBehavior = SnapFlingBehavior(listState),
            horizontalArrangement = Arrangement.spacedBy(8.dp)
        ) {
            items(items) { item ->
                Card(modifier = Modifier.width(150.dp)) {
                    Text(text = item, modifier = Modifier.padding(16.dp))
                }
            }
        }

        Row(modifier = Modifier.fillMaxWidth()) {
            Button(onClick = {
                scope.launch {
                    listState.animateScrollToItem(0)
                }
            }) { Text("শুরু করতে") }
        }
    }
}

ইন্টারফেসে LazyRow ব্যবহারের উদাহরণ

প্রথম উদাহরণ — প্রিভিউ সহ ইমেজ গ্যালারির জন্য LazyRow। প্রতিটি উপাদান একটি Box যার মধ্যে একটি ছবি এবং ক্যাপশন রয়েছে। LazyRow কয়েক ডজন এবং শত শত ছবি দক্ষতার সাথে পরিচালনা করে, শুধুমাত্র দৃশ্যমান ছবি লোড করে।

@Composable
fun ImageGallery(images: List<String>) {
    LazyRow(
        contentPadding = PaddingValues(start = 16.dp, end = 16.dp),
        horizontalArrangement = Arrangement.spacedBy(12.dp)
    ) {
        items(images, key = { it }) { url ->
            AsyncImage(
                model = url,
                contentDescription = "Image",
                modifier = Modifier.size(120.dp)
            )
        }
    }
}

দ্বিতীয় উদাহরণ — আইকন সহ ক্যাটাগরি তালিকার জন্য LazyRow। ক্যাটাগরিগুলি চিপ হিসাবে প্রদর্শিত হয় এবং ব্যবহারকারী সেগুলি অনুভূমিকভাবে স্ক্রোল করতে পারে। spacedBy এবং contentPadding সহ LazyRow ক্যাটাগরির মধ্যে এবং কিনারায় স্পেসিং তৈরি করে।

@Composable
fun CategoryChips(categories: List<String>) {
    LazyRow(
        contentPadding = PaddingValues(horizontal = 16.dp),
        horizontalArrangement = Arrangement.spacedBy(8.dp)
    ) {
        items(categories, key = { it }) { category ->
            AssistChip(
                onClick = {},
                label = { Text(category) }
            )
        }
    }
}

LazyRow বনাম Row: কখন কী বেছে নেবেন

LazyRow এবং Row এর মধ্যে পছন্দ উপাদানের সংখ্যার উপর নির্ভর করে। Row 5–10টি উপাদানের জন্য উপযুক্ত যা সর্বদা স্ক্রিনে দৃশ্যমান। LazyRow প্রয়োজনীয় যখন অনেক উপাদান থাকে বা তাদের সংখ্যা গতিশীল হয়।

Row একসাথে সমস্ত উপাদান রেন্ডার করে, যা বিপুল সংখ্যক উপাদানের সাথে বিলম্ব ঘটায়। LazyRow শুধুমাত্র দৃশ্যমান উপাদান রেন্ডার করে, যা এটিকে স্ক্রোলযোগ্য তালিকার জন্য পছন্দনীয় করে তোলে। Android Developers Blog, 2024 অনুসারে, স্থানান্তর সীমা প্রায় 10টি উপাদান: যদি আরও উপাদান থাকে, LazyRow ব্যবহার করুন।

LazyRow অ্যানিমেশন, SnapFlingBehavior এবং বিভাজকের মাধ্যমে গ্রুপিং সমর্থন করে, যা এটিকে জটিল ইন্টারফেসের জন্য আরও নমনীয় করে তোলে। Row সহজ এবং LazyListState এর প্রয়োজন নেই, কিন্তু দীর্ঘ তালিকার জন্য অপ্টিমাইজ করা নয়।

• Row — স্ক্রোল ছাড়া 5–10টি স্থির উপাদানের জন্য
• LazyRow — অনুভূমিক স্ক্রোলিং সহ 10+ উপাদানের জন্য
• LazyRow — ক্যারাউসেল, গ্যালারি, গতিশীল তালিকার জন্য