如何在LazyColumnJetpackCompose中的项目之间添加分隔线？

html5 • • 问答

我有一个如下所示的 LazyColumn：

LazyColumn (
    verticalArrangement = Arrangement.spacedBy(12.dp)
) {
    items(bookList) { book ->
        InProgressBookItem(book = book)
    }
}

如何在列表中的每个项目之间添加一行，类似于在旧的 RecyclerView 上使用项目装饰？

回答

目前，1.0.x您只需Divider在LazyListScope.

就像是：

   LazyColumn(
        verticalArrangement = Arrangement.spacedBy(12.dp),
    ) {
        items(itemsList){
            Text("Item at  $it")
            Divider(color = Color.Black)
        }
    }

如果你想避免Divider在最后一个项目中，你可以使用：

   LazyColumn(
        verticalArrangement = Arrangement.spacedBy(12.dp),
    ) {
        itemsIndexed(itemsList) { index, item ->
            Text("Item at index $index is $item")
            if (index < itemsList.size-1)
                Divider(color = Color.Black, thickness = 1.dp)
        }

    }

  • This was my first thought, but I was hoping there would be a more elegant/built in way to do it. For now, this should work, thank you!
以上是如何在LazyColumnJetpackCompose中的项目之间添加分隔线？的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>