Jetpack Compose中-90度旋转Text组成的Row布局错位问题

问题核心根源 #

• rotate() 修饰符本质是绘制阶段的纯视觉变换，完全不参与父布局的测量计算流程。Compose的布局执行顺序是固定的：Row向子组件下发测量约束 → 每个子组件计算自身的最终宽高并返回给Row → Row根据拿到的测量值确定所有子项的横向排布位置 → 所有组件依次完成绘制。
• 给Text加rotate(-90f)的效果，只会在最后一步绘制阶段生效：等Text已经按未旋转状态算完尺寸、摆好位置了，才会应用旋转矩阵在画布上转出视觉效果。整个测量流程里，Row拿到的每个Text的宽度，还是文本横向铺开时的原始长度——比如一段180dp宽、24dp高的单行文本，转-90度之后视觉上横向只需要占24dp的空间，但Row依然会按180dp的宽度给它分配横向占位距离。

重叠现象的产生逻辑 #

• Row排布子项时，是靠累加每个子项返回的测量宽度来算横向偏移的。放三个不同长度的旋转Text时，每个Text都把自己未旋转时的横向文本宽度报给Row，Row自然按这些偏大的宽度值给每个子项算摆放位置。等真正绘制时，每个文本转完的视觉宽度远小于Row分配的实际空间，再加上不同文本的原始长度差异带来的位置计算偏差，就会出现视觉上的文本重叠。
• 当前写的修饰符顺序（先加2dp内边距、再加旋转）根本解决不了这个问题：padding是会正常参与测量计算的，但旋转带来的宽高互换效果，完全不会反向回传给测量流程，两个修饰符的效果是完全割裂的。

正确实现的核心方向 #

• 要让旋转后的Text在Row里正确排布，不能直接用纯绘制层面的rotate()修饰符。需要在测量阶段就手动适配旋转后的实际占位尺寸：把Text旋转后的实际横向宽度（等于未旋转时的文本高度）、实际纵向高度（等于未旋转时的文本宽度）作为测量结果返回给Row，再配合绘制阶段的旋转效果，Row才能正确计算每个子项需要的横向间距。
• 典型的错误写法参考：

// 错误示例：只做绘制层旋转，没有适配测量尺寸
Text(
    text = "不同长度的测试文本",
    maxLines = 1,
    modifier = Modifier
        .padding(2.dp)
        .rotate(-90f)
)

内容的提问来源于stack exchange，提问作者Mahdi-Malv