Jetpack Compose中Row内fillMaxWidth未预留空间导致Icon不显示

当前Cardcontent可组合项添加了fillMaxWidth修饰符
问题根源是Compose Row布局的测量规则：fillMaxWidth() 会让当前组件向父布局申请占据所有可用宽度，你在Cardcontent的根Row上加了这个修饰符后，它会直接抢占父容器CardTest下Row的全部宽度，同级的Icon组件没有剩余布局空间可以分配，就无法正常渲染。
你期望的效果是Cardcontent占满除Icon固定尺寸外的剩余宽度，而不是占满整行把Icon挤走。

问题运行效果 #

目标设计参考 #

把Cardcontent里fillMaxWidth()的修饰符前加上weight(1f)即可，weight修饰符在Row/Column作用域下的逻辑是：等父布局测量完所有不带weight的固定尺寸子元素后，再按权重比例分配剩余空间给带weight的子元素，这样Cardcontent会自动给40dp大小的Icon预留位置，不会占满整行。
修改后的代码如下：

@Preview
@Composable
fun Icon () {
    Image(
        painter = painterResource(id = R.drawable.icon),
        contentDescription = "Icon",
        modifier = Modifier.size(width = 40.dp, height = 40.dp)
    )
}

@Preview
@Composable
fun Cardcontent() {
    Row(
        horizontalArrangement = Arrangement.spacedBy(16.dp),
        verticalAlignment = Alignment.CenterVertically,
        modifier = Modifier
            .weight(1f)
            .fillMaxWidth()
    ) {
        Avatar()
        TextDesc()
    }
}

@Preview
@Composable
fun CardTest() {
    Row(
        Modifier
            .width(310.dp)
            .padding(start = 16.dp)
            .padding(vertical = 13.dp),
        verticalAlignment = Alignment.CenterVertically
    ) {
        Cardcontent()
        Icon()
    }
}

注意：weight是Row/Column的扩展修饰符，必须写在Cardcontent内部根布局的modifier链上，才能被外层CardTest的Row识别到权重规则，不要在CardTest调用处给Cardcontent额外套weight，避免组件耦合。

内容的提问来源于stack exchange，提问作者Jeremías Samaniego