Sobes.tech
Middle

Como criar um RecyclerView no Jetpack Compose?

sobes.tech IA

Resposta da IA

No Jetpack Compose, não existe um RecyclerView no sentido tradicional. Para exibir listas, usa-se LazyColumn (para listas verticais) e LazyRow (para listas horizontais). Eles oferecem uma eficiência semelhante através da reutilização de elementos.

Exemplo de uso de 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)
        }
    }
}

Análise:

  • LazyColumn: Função composable que exibe elementos numa lista vertical, criando-os conforme necessário.
  • items(itemsList) { item -> ... }: Extensão para LazyListScope que permite iterar sobre a lista de dados (itemsList) e para cada elemento (item) chamar o lambda Composable fornecido. Este bloco define como será cada elemento da lista.
  • Text(text = item): Função composable simples que mostra o texto do elemento atual.

Características principais de LazyColumn/LazyRow:

  • Eficiência: Os elementos são criados e compostos apenas quando se tornam visíveis na tela ou estão perto da borda. Isto reduz o consumo de memória e melhora o desempenho para listas grandes.
  • Simplicidade: API simplificada em comparação com RecyclerView, sem necessidade de criar adaptadores, ViewHolder ou gerir o ciclo de vida destes componentes.
  • Integração total: Integra-se perfeitamente com outras funções do Compose.

Pode-se usar itemsIndexed para aceder ao índice de cada elemento:

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 no índice $index: $item")
        }
    }
}

Para comportamentos mais complexos (por exemplo, diferentes tipos de visualizações), pode-se usar sobrecargas de items ou 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 -> {
                    // Aqui pode-se mostrar uma imagem, por exemplo com a função Image
                    Text(text = "Imagem: ${item.url}") // Marcador de posição
                }
            }
        }
    }
}