LazyVerticalGrid使用GridCells.Fixed(6)时网格项大小不一致问题

问题核心是LazyVerticalGrid未占满父容器宽度，导致GridCells.Fixed(6)无法将可用空间均匀分配给6列，进而出现网格项尺寸不一的情况。

修改步骤： #

• 给LazyVerticalGrid的modifier添加.fillMaxWidth()，确保网格整体占满父容器的可用宽度
• 保留网格项的.fillMaxWidth().aspectRatio(1f)，保证每个项是正方形且填满对应单元格

修改后的完整代码：

@Composable
fun WordSearch() {
    LazyVerticalGrid(
        state = rememberLazyGridState(),
        modifier = Modifier.fillMaxWidth(), // 关键：让网格占满父宽度
        columns = GridCells.Fixed(6),
        contentPadding = PaddingValues(0.dp) // 可选：移除默认内边距，让网格边缘对齐父容器
    ) {
        itemsIndexed(listOfChars) { index, item ->
            Box(
                contentAlignment = Alignment.Center,
                modifier = Modifier
                    .fillMaxWidth()
                    .aspectRatio(1f) // 保持正方形比例
                    .border(1.dp, Black)
            ) {
                Text(
                    text = item,
                    style = TextStyle(fontSize = 20.sp)
                )
            }
        }
    }
}

补充说明： #

• GridCells.Fixed(n)的作用是将网格总宽度平均分割为n等份，因此必须保证网格本身有明确的宽度约束（比如占满父容器），否则无法完成均匀分配
• 如果需要网格同时占满父容器高度，可以给LazyVerticalGrid的modifier改为.fillMaxSize()，配合verticalArrangement参数调整项的垂直排列方式

内容的提问来源于stack exchange，提问作者Mohammad Hanif Shaikh