Jetpack Compose双Text组件自适应占宽布局问题求助

需求回顾 #

• 两个Text组件并排，优先单行显示
• 若无法单行：宽度超过可用空间50%的组件转为多行，另一个保持单行
• 若两者内容均过长：各占用50%的可用宽度并自动换行

原代码问题分析 #

你当前的代码通过Spacer(modifier = Modifier.weight(1f))将两个Text固定在Row两端，中间填充剩余空间。这种布局逻辑无法根据内容长度动态分配宽度，导致：

• 第三个示例中，短的第二个Text没有获得足够的单行空间，长的第一个Text被过度压缩
• 第四个示例中，两个Text无法平分可用宽度

正确实现方案 #

使用weight(1f, fill = false)为两个Text分配动态宽度，结合softWrap = true实现自动换行：

Row(
    modifier = Modifier.fillMaxWidth(),
    horizontalArrangement = Arrangement.spacedBy(8.dp) // 可选：添加固定间距提升可读性
) {
    Text(
        text = first,
        modifier = Modifier
            .weight(1f, fill = false)
            .wrapContentWidth(Alignment.Start),
        softWrap = true
    )
    
    Text(
        text = second,
        modifier = Modifier
            .weight(1f, fill = false)
            .wrapContentWidth(Alignment.End),
        softWrap = true
    )
}

逻辑说明 #

1. weight(1f, fill = false)：
   • 让两个Text按1:1的比例分配Row的剩余空间，但不会强制拉伸内容较短的Text（fill = false）
   • 若单个Text的内容宽度超过分配到的空间（即超过可用宽度的50%），则自动换行
2. wrapContentWidth：确保内容较短的Text保持自身宽度，不会被拉伸到50%
3. spacedBy：替代手动添加Spacer，更简洁地设置两个Text之间的固定间距

效果验证 #

• 当两个Text内容都较短：各自占用自身宽度，并排单行显示
• 当一个短一个长：短Text保持单行，长Text占用剩余空间并自动换行
• 当两个Text都过长：各占50%可用宽度，均自动换行

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