Jetpack Compose LazyColumn列表项内文本居中对齐失效问题

对齐属性不生效的核心逻辑是：Jetpack Compose中容器的对齐规则，仅在容器自身拥有明确尺寸约束、存在可供排布子元素的剩余空间时才会生效。你的代码存在两个直接导致对齐失效的问题：

• 列表项的根Column没有设置固定高度，尺寸完全由内部子组件（Text+Divider）撑开，没有多余空间给子元素做居中排布，因此设置的horizontalAlignment、verticalArrangement属性不会产生可见效果
• 你把50dp的固定高度直接设置在了Text组件上，但textAlign参数仅控制文本在Text组件内部的水平对齐，默认文本会从Text布局的顶部开始绘制，因此文本会始终贴在单元格顶部

考虑到你需要分隔线始终显示在两个列表项之间（即每个列表项的底部），推荐调整布局尺寸的归属，让文本区域占满列表项除分隔线外的全部空间，再让文本在该区域内实现水平+垂直双向居中，这种写法分隔线位置不会偏移，布局逻辑也更清晰，修正后的完整代码如下：

Box(modifier = Modifier.background(Color(0xFFf4f4f4))
    .fillMaxSize()
    .padding(top = 20.dp)) {
    Card(
        modifier = Modifier.fillMaxWidth(),
        shape = RoundedCornerShape(20.dp),
        elevation = 5.dp
    ) {
        val colorNamesList = listOf("Red", "Green", "Blue", "Indigo")
        LazyColumn {
            itemsIndexed(colorNamesList) { index, item ->
                Column(
                    modifier = Modifier
                        .fillMaxWidth()
                        // 给列表项根容器设置固定高度，明确尺寸约束
                        .height(50.dp)
                        .background(color = Color(0xFFf2f2f2))
                        .clickable { println(item) },
                    horizontalAlignment = Alignment.CenterHorizontally
                ) {
                    Text(
                        text = "Item at  $item",
                        modifier = Modifier
                            .fillMaxWidth()
                            // 让文本区域占满除分隔线外的全部剩余高度
                            .weight(1f)
                            // 文本在自身区域内垂直居中
                            .wrapContentHeight(Alignment.CenterVertically),
                        // 文本在自身区域内水平居中
                        textAlign = TextAlign.Center,
                        color = Color.Black,
                    )
                    // 最后一项不显示分隔线
                    if (index < colorNamesList.lastIndex) {
                        Divider(
                            color = Color.Black.copy(alpha = 0.2f),
                            modifier = Modifier.padding(horizontal = 80.dp),
                            // 固定分隔线高度，避免不同设备默认值差异
                            thickness = 1.dp
                        )
                    }
                }
            }
        }
    }
}

如果你不想大幅调整现有代码结构，也可以用快速修改方案：直接给现有Text组件加wrapContentHeight(Alignment.CenterVertically)修饰符，同时保留textAlign = TextAlign.Center即可实现文本双向居中，但要注意这种写法下列表项总高度为50dp加分隔线高度，对项尺寸精度要求高的场景不推荐使用：

Text(
    text = "Item at  $item",
    modifier = Modifier
        .fillMaxWidth()
        .height(50.dp)
        // 让文本在50dp高的Text布局内垂直居中
        .wrapContentHeight(Alignment.CenterVertically),
    textAlign = TextAlign.Center,
    color = Color.Black,
)

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