Как да създадем RecyclerView в Jetpack Compose…

В Jetpack Compose няма RecyclerView в традиционния смисъл. За показване на списъци се използват LazyColumn (за вертикални списъци) и LazyRow (за хоризонтални списъци). Те осигуряват подобна ефективност чрез повторно използване на елементи.

Пример за използване на LazyColumn:

import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.Text
import androidx.compose.runtime.Composable

@Composable
fun SimpleList(itemsList: List<String>) {
    LazyColumn {
        items(itemsList) { item ->
            Text(text = item)
        }
    }
}

Анализ:

LazyColumn: Функция, която се композира и показва елементи във вертикален списък, създавайки ги при необходимост.
items(itemsList) { item -> ... }: Разширение за LazyListScope, което позволява да се итерара върху списъка с данни (itemsList) и за всеки елемент (item) да се извика предоставената Composable ламбда функция. В този блок се определя как ще изглежда всеки елемент от списъка.
Text(text = item): Простата подкомпонента, която показва текста на текущия елемент.

Основни характеристики на LazyColumn/LazyRow:

Ефективност: Елементите се създават и композират само когато станат видими на екрана или са близо до ръба. Това намалява използването на памет и подобрява производителността при големи списъци.
Простота: Облекчен API в сравнение с RecyclerView, който не изисква създаване на адаптер, ViewHolder и управление на жизнения цикъл.
Първо клас компоненти: Пълна интеграция с други Compose функции.

Може да се използва itemsIndexed за достъп до индекса на всеки елемент:

import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.itemsIndexed
import androidx.compose.material.Text
import androidx.compose.runtime.Composable

@Composable
fun IndexedList(itemsList: List<String>) {
    LazyColumn {
        itemsIndexed(itemsList) { index, item ->
            Text(text = "Item at index $index: $item")
        }
    }
}

За по-сложно поведение (например различни типове изгледи), може да се използва пренатоварване на items или item:

import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.Text
import androidx.compose.runtime.Composable

sealed class ListItem {
    data class TextItem(val content: String) : ListItem()
    data class ImageItem(val url: String) : ListItem()
}

@Composable
fun MixedList(itemsList: List<ListItem>) {
    LazyColumn {
        items(itemsList) { item ->
            when (item) {
                is ListItem.TextItem -> Text(text = item.content)
                is ListItem.ImageItem -> {
                    // Тук може да покажете изображение, например с помощта на функцията Image
                    Text(text = "Image: ${item.url}") // Задържане
                }
            }
        }
    }
}

Как да създадем RecyclerView в Jetpack Compose?