Activity窗口设为透明时LazyColumn滚动出现异常行为

原因 #

Jetpack Compose的LazyColumn采用Item复用机制优化性能——滚动时会回收出界的Item布局，重新绑定数据后复用给新进入视野的Item。当Activity窗口背景为透明时，复用的Item区域没有不透明背景覆盖，导致旧的Item内容（比如之前的文本）没有被完全清除，从而出现滚动显示异常；而设置窗口背景为白色后，白色背景会覆盖复用区域的旧内容，所以显示恢复正常。

解决方案 #

1. 给LazyColumn整体添加背景（推荐）

直接给LazyColumn的Modifier添加背景色，确保整个列表区域有不透明背景，覆盖复用产生的残留内容：

LazyColumn(
    modifier = Modifier.background(Color.White) // 添加背景
) {
    items(20) {
        Text(
            text = "hi$it",
            color = Color.Green,
            textAlign = TextAlign.Center,
            modifier = Modifier.fillMaxWidth().height(50.dp)
        )
    }
}

2. 给每个Item单独添加背景

如果需要Item有独立背景，可以在Text的Modifier中添加背景：

LazyColumn {
    items(20) {
        Text(
            text = "hi$it",
            color = Color.Green,
            textAlign = TextAlign.Center,
            modifier = Modifier
                .fillMaxWidth()
                .height(50.dp)
                .background(Color.White) // 给每个Item加背景
        )
    }
}

3. 禁用Item复用（不推荐，影响性能）

通过给items设置唯一key，强制每个Item不被复用，但会降低大列表的滚动性能，仅适合小列表场景：

LazyColumn {
    items(20, key = { it }) { // 设置唯一key禁用复用
        Text(
            text = "hi$it",
            color = Color.Green,
            textAlign = TextAlign.Center,
            modifier = Modifier.fillMaxWidth().height(50.dp)
        )
    }
}

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