Middle
Kako napraviti RecyclerView u Jetpack Compose?
sobes.tech АИ
Одговор од АИ
У 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}") // Заменска
}
}
}
}
}