Compose v1.4.0中FlowRow行列间距设置及底部冗余padding解决

问题背景 #

从Accompanist库的FlowLayout迁移到Jetpack Compose 1.4.0原生FlowRow时，原通过FlowCrossAxisAlignment、FlowMainAxisAlignment设置行列间距的方式已不再支持。当前原生FlowRow仅能通过Arrangement.spacedBy(16.dp)配置水平轴间距，垂直轴暂无官方直接设置方案。

临时方案与缺陷 #

官方给出的临时处理方式是为每个子元素添加底部padding，但这会导致最后一行也出现冗余的底部padding，示例代码与效果如下：

FlowRow(modifier = modifier.background(color =Color.Blue), horizontalArrangement = Arrangement.spacedBy(16.dp)) {
            chips.forEach { chip ->
                Chip(
                    modifier = Modifier.background(color = Color.Cyan).padding(bottom = 16.dp),
                    label = chip.label
                )
            }
        }

后续计划 #

该问题已被提交至官方问题追踪系统，对应的解决方案提议已被接受，官方将在后续版本中为FlowRow添加原生垂直间距配置功能。

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