Middle
Cum se creează un RecyclerView în Jetpack Compose?
sobes.tech AI
Răspuns de la AI
În Jetpack Compose, nu există un RecyclerView în sensul tradițional. Pentru afișarea listelor, se utilizează LazyColumn (pentru liste verticale) și LazyRow (pentru liste orizontale). Acestea oferă o eficiență similară prin reutilizarea elementelor.
Exemplu de utilizare a 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)
}
}
}
Analiză:
LazyColumn: Funcție composabilă care afișează elementele într-o listă verticală, creându-le după nevoie.items(itemsList) { item -> ... }: Extensie pentruLazyListScopecare permite iterarea peste lista de date (itemsList) și apelarea lambda-uluiComposablepentru fiecare element (item). În acest bloc se definește cum arată fiecare element al listei.Text(text = item): Funcție simplăComposablecare afișează textul elementului curent.
Caracteristici principale ale LazyColumn/LazyRow:
- Eficiență: Elementele sunt create și compuse doar când devin vizibile pe ecran sau sunt aproape de margine. Acest lucru reduce consumul de memorie și îmbunătățește performanța pentru liste mari.
- Simplitate: API-ul este simplificat comparativ cu RecyclerView, fără a fi nevoie de creare de adaptori, ViewHolder sau gestionarea ciclului de viață al acestor componente.
- Integrare completă: Se integrează perfect cu alte funcții Compose.
Se poate folosi itemsIndexed pentru a accesa indicele fiecărui element:
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 = "Element la indexul $index: $item")
}
}
}
Pentru comportamente mai complexe (de exemplu, tipuri diferite de vizualizări), se pot folosi suprasarcini de items sau 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 -> {
// Aici poți afișa o imagine, de exemplu cu funcția Image
Text(text = "Imagine: ${item.url}") // Pseudo-element
}
}
}
}
}