如何在Compose的LazyColumn中获取过度滚动（overscroll）量？

要解决LazyColumn过度滚动时drawBehind绘制的矩形无法跟随拉伸的问题，核心是捕获过度滚动的偏移量，并将其应用到绘制逻辑中。以下是可行的解决方案：

通过NestedScrollConnection监听过度滚动偏移 #

这是通用方案，兼容所有支持Compose的Android版本，包括Android 12+的弹性拉伸效果。

实现步骤： #

1. 用状态变量保存过度滚动偏移量
2. 自定义NestedScrollConnection捕获滚动事件中的过度滚动偏移
3. 将偏移量同步到drawBehind的绘制逻辑，调整矩形的位置和尺寸

代码示例： #

@Composable
fun OverscrollLazyColumn() {
    var overscrollOffset by remember { mutableStateOf(0f) }

    val nestedScrollConnection = remember {
        object : NestedScrollConnection {
            override fun onPreScroll(available: Offset, source: NestedScrollSource): Offset {
                // 拖拽时捕获过度滚动偏移：向下拉（顶部）偏移为正，向上拉（底部）为负
                if (source == NestedScrollSource.Drag) {
                    overscrollOffset = available.y
                }
                return Offset.Zero // 不消耗滚动事件，保留LazyColumn原有滚动逻辑
            }

            override fun onPostScroll(
                consumed: Offset,
                available: Offset,
                source: NestedScrollSource
            ): Offset {
                // 拖拽结束后重置偏移量
                if (source == NestedScrollSource.Drag && available.y == 0f) {
                    overscrollOffset = 0f
                }
                return Offset.Zero
            }
        }
    }

    LazyColumn(
        modifier = Modifier
            .nestedScroll(nestedScrollConnection)
            .drawBehind {
                val canvasSize = size
                // 根据偏移方向调整矩形参数
                val (rectTop, rectHeight) = when {
                    // 顶部过度滚动：矩形向上延伸并增高
                    overscrollOffset > 0 -> -overscrollOffset to canvasSize.height + overscrollOffset
                    // 底部过度滚动：矩形向下延伸并增高
                    overscrollOffset < 0 -> 0f to canvasSize.height - overscrollOffset
                    // 无过度滚动：正常绘制
                    else -> 0f to canvasSize.height
                }

                drawRect(
                    color = Color.Blue,
                    topLeft = Offset(0f, rectTop),
                    size = Size(canvasSize.width, rectHeight)
                )
            }
    ) {
        items(100) { index ->
            Text(
                text = "Item $index",
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(16.dp)
            )
        }
    }
}

适配Android 12+弹性拉伸的细节优化 #

Android 12+的弹性拉伸是系统层面的动画，上述方案已能捕获偏移量，若要更贴合系统动画的流畅度，可结合Modifier.graphicsLayer做细微调整：

// 在LazyColumn的modifier中添加
Modifier
    .nestedScroll(nestedScrollConnection)
    .graphicsLayer {
        // 根据过度滚动偏移调整纵向缩放，增强拉伸视觉一致性
        scaleY = 1f + (overscrollOffset / size.height).coerceIn(-0.1f, 0.1f)
    }
    .drawBehind { /* 原有绘制逻辑 */ }

关键说明 #

• LocalOverscrollConfiguration的作用是替换或禁用默认过度滚动效果，而非获取偏移量，因此之前的尝试无法解决问题是正常的。
• 过度滚动偏移量的正负对应不同方向：正数为顶部向下拉的过度滚动，负数为底部向上拉的过度滚动，需根据方向调整绘制逻辑。

内容的提问来源于stack exchange，提问作者tibo mertz