Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

271
Views
¿Cuál es el equivalente de Jetpack Compose de RecyclerView o ListView?

En Jetpack Compose, ¿cómo puedo mostrar una gran lista de datos al mismo tiempo que diseño solo los elementos visibles, en lugar de componer y diseñar cada elemento en el pase de diseño inicial? Esto sería similar a RecyclerView y ListView en el kit de herramientas View .

Se podría usar un ciclo for para colocar todos los componentes dentro de una Column en un VerticalScroller , pero esto daría como resultado marcos perdidos y un rendimiento deficiente en una mayor cantidad de elementos.


Nota: esto pretende ser una pregunta canónica autorespondida para adelantarse/manejar preguntas similares

over 4 years ago · Hanz Gallego
2 answers
Answer question

0

El componente equivalente a RecyclerView o ListView en Jetpack Compose es LazyColumn para una lista vertical y LazyRow para una lista horizontal. Estos componen y disponen solo los elementos actualmente visibles.

Puede usarlo formateando sus datos como una lista y pasándolos con una devolución de llamada @Composable que emite la interfaz de usuario para un elemento determinado en la lista. Por ejemplo:

 val myData = listOf("Hello,", "world!") LazyColumn { items(myData) { item -> Text(text = item) } }
 val myData = listOf("Hello,", "world!") LazyRow { items(myData) { item -> Text(text = item) } }

También puede especificar elementos individuales de uno en uno:

 LazyColumn { item { Text("Hello,") } item { Text("world!") } }
 LazyRow { item { Text("Hello,") } item { Text("world!") } }

También hay variantes indexadas, que proporcionan el índice de la colección además del elemento en sí:

 val myData = listOf("Hello,", "world!") LazyColumn { itemsIndexed(myData) { index, item -> Text(text = "Item #$index is $item") } }
 val myData = listOf("Hello,", "world!") LazyRow { itemsIndexed(myData) { index, item -> Text(text = "Item #$index is $item") } }

En versiones anteriores, estas API se conocían como AdapterList , LazyColumnItems / LazyRowItems y LazyColumnFor / LazyRowFor .

over 4 years ago · Hanz Gallego Report

0

Actualización en dev.16

  • [ScrollableColumn] para lista de desplazamiento vertical
  • [ScrollableRow] para lista de desplazamiento horizontal

Verifique su implementación desde ListCardViewTemplate


Puede obtener la misma esencia de RecyclerView o ListView en JetpackCompose usando AdapterList cuyo nombre se cambió en la versión preliminar dev.14.

  • [LazyColumnItems] para lista de desplazamiento vertical
  • [LazyRowItems] para lista de desplazamiento horizontal

Compruebe lo que dice la documentación:

También se movió a un lazy y se dividió en dos archivos. Además, cambié el nombre de params:

  1. datos -> elementos. esto parece ser más significativo que solo data sin procesar
  2. itemCallback -> itemContent. esto es más significativo y, por lo general, no usamos la devolución de llamada de Word en los nombres de lambda, especialmente para las lambdas componibles.

Comprueba cómo usarlo:

 @Composable fun <T> LazyColumnItems( items: List<T>, modifier: Modifier = Modifier, itemContent: @Composable (T) -> Unit ) { LazyItems(items, modifier, itemContent, isVertical = true) }

En .KT

 LazyColumnItems(items = (0..50).toList()) { item -> cardViewImplementer(item) }

Desde mi perspectiva, LazyColumnItem o LazyRowItem no funcionan correctamente si el diseño de su elemento es complejo porque está atascado en la lista en comparación con VerticalScroller que funciona bien en este escenario.

over 4 years ago · Hanz Gallego Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!