Middle
Kaip sukurti RecyclerView Jetpack Compose?
sobes.tech AI
Atsakymas iš AI
Jetpack Compose nėra RecyclerView tradiciniame supratime. Sąrašų rodymui naudojami LazyColumn (vertikaliems sąrašams) ir LazyRow ( horizontaliems sąrašams). Jie užtikrina panašią efektyvumą, naudojant elementų pakartotinį naudojimą.
LazyColumn pavyzdys:
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)
}
}
}
Analizė:
LazyColumn: Komponuojama funkcija, kuri rodo elementus vertikaliame sąraše, sukurdama juos pagal poreikį.items(itemsList) { item -> ... }: IšplėtimasLazyListScope, leidžiantis pereiti per duomenų sąrašą (itemsList) ir kiekvienam elementui (item) iškviesti pateiktąComposablelambda bloką. Šiame bloke nustatoma, kaip atrodys kiekvienas sąrašo elementas.Text(text = item): Paprasta vaikų komponentė, rodanti teksto turinį.
Pagrindinės LazyColumn/LazyRow savybės:
- Efektyvumas: Elementai kuriami ir komponuojami tik tada, kai jie tampa matomi ekrane arba yra arti krašto. Tai sumažina atminties naudojimą ir pagerina našumą dideliuose sąrašuose.
- Paprastumas: Supaprastintas API, lyginant su RecyclerView, nereikalaujantis sukurti adapterio, ViewHolder ir valdyti jų gyvavimo ciklą.
- Komponuojamas pirmas: Pilnai integruojasi su kitomis Compose funkcijomis.
Galite naudoti itemsIndexed, kad pasiektumėte kiekvieno elemento indeksą:
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")
}
}
}
Daugiau sudėtingo elgesio (pavyzdžiui, skirtingų vaizdų tipų) galima pasiekti per perkrovimą items arba 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 -> {
// Čia galite parodyti vaizdą, pvz., naudodami Image funkciją
Text(text = "Image: ${item.url}") // Užkulisiai
}
}
}
}
}