Jetpack撰写中的惰性滚动

如何解决Jetpack撰写中的惰性滚动

从Jetpack Compose开始，Recycler类型的视图称为Lazy。

目前，只有惰性行和惰性列。

我有一个交错网格自定义可编辑对象，可以滚动。但是有办法让我变得懒惰吗？还是这样的API不稳定？

解决方法

您可以通过多种方式实现相同的效果，其中之一是：

@Composable
fun StaggeredVerticalGrid(
    modifier: Modifier = Modifier,maxColumnWidth: Dp,children: @Composable () -> Unit
) {
    Layout(
        children = children,modifier = modifier
    ) { measurables,constraints ->
        check(constraints.hasBoundedWidth) {
            "Unbounded width not supported"
        }
        val columns = ceil(constraints.maxWidth / maxColumnWidth.toPx()).toInt()
        val columnWidth = constraints.maxWidth / columns
        val itemConstraints = constraints.copy(maxWidth = columnWidth)
        val colHeights = IntArray(columns) { 0 } // track each column's height
        val placeables = measurables.map { measurable ->
            val column = shortestColumn(colHeights)
            val placeable = measurable.measure(itemConstraints)
            colHeights[column] += placeable.height
            placeable
        }

        val height = colHeights.maxOrNull()?.coerceIn(constraints.minHeight,constraints.maxHeight)
            ?: constraints.minHeight
        layout(
            width = constraints.maxWidth,height = height
        ) {
            val colY = IntArray(columns) { 0 }
            placeables.forEach { placeable ->
                val column = shortestColumn(colY)
                placeable.place(
                    x = columnWidth * column,y = colY[column]
                )
                colY[column] += placeable.height
            }
        }
    }
}

private fun shortestColumn(colHeights: IntArray): Int {
    var minHeight = Int.MAX_VALUE
    var column = 0
    colHeights.forEachIndexed { index,height ->
        if (height < minHeight) {
            minHeight = height
            column = index
        }
    }
    return column
}

从Owl sample app中提取，请不要忘记在ScrollableColumn中包装/调用此Composable。

编辑：随着compose 1.0.0-alpha09的发布，现在您有了正式的LazyVerticalGrid，请选中release notes

,

如果您正在实施自定义交错网格，我会说您改为实施交错行。然后创建另一个 Composable 来接收数据并在交错的行中提供它，同时在内部为每行使用一个惰性列。我不是要你实施新的东西。只需稍微调整现有的实现，就会有很大的性能提升。

另外，如果你的数据不够大，也可以不使用惰性容器。