Question

在Jetpack Compose中，如何只显示可见项目而不显示和布局初始布局遍历中的每个项目而显示大量数据？这类似于RecyclerView工具包中的ListView和View。

一个人可以使用for循环将Column内的所有组件放置在VerticalScroller中，但这会导致丢帧和大量项目上的性能下降

^{注意：这旨在作为规范的自我回答问题来抢占/处理类似问题}

Answer 1

Jetpack Compose中与RecyclerView或ListView等效的组件是LazyColumnFor（对于垂直列表）和LazyRowFor（对于水平列表）。这些仅构成并布局当前可见的项目。

通过将数据格式化为列表并通过@Composable回调传递数据来使用它，该回调发出列表中给定项目的UI。例如：

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

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

还有索引变体，除了项目本身之外，它们还提供集合中的索引：

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

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

在以前的版本中，这些API被称为AdapterList和LazyColumnItems / LazyRowItems。

Answer 2

在dev.16中更新

[ScrollableColumn]用于垂直滚动列表
[ScrollableRow]用于水平滚动列表

从ListCardViewTemplate

检查其实现

您可以使用在dev.14预览版本中重命名的RecyclerView在JetpackCompose中获得与ListView或AdapterList相同的本质。

[LazyColumnItems]用于垂直滚动列表
[LazyRowItems]用于水平滚动列表

查看文档中的内容：

它也被移到lazy子包中并分成两个文件。另外，我将重命名为params：

数据->项。这似乎比原始更有意义 data

itemCallback-> itemContent。这更有意义，我们通常不要在lambda名称中使用单词回调，尤其是对于可组合的lambdas

检查其使用方式：

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

在.KT中

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

从我的角度来看，如果您的项目布局很复杂，LazyColumnItem或LazyRowItem不能正常工作，因为与这种情况下VerticalScroller正常工作相比，它卡住了列表。

什么是RepackerView或ListView的Jetpack Compose等效项？

2 个答案: