Jetpack Compose中Row内按钮用Alignment.TopEnd报错类型不匹配

问题场景 #

想要将按钮放置在右上角，但代码出现类型不匹配错误，原代码如下：

Row {
    Button(
        colors = mainButtonColor,
        modifier = Modifier
            .align(Alignment.TopEnd)
            .border(width = 2.dp, color = Color.Yellow)
            .weight(1f)
            .shadow(3.dp),
        onClick = {},
    ) {
        // ...
    }
}

错误提示 #

类型不匹配。
必需：Alignment.Vertical
找到：Alignment

错误原因 #

Row布局的Modifier.align()仅接受Vertical类型的对齐参数（如Alignment.Top、Alignment.CenterVertically、Alignment.Bottom），而Alignment.TopEnd是包含水平+垂直方向的完整对齐类型，不符合参数要求。

修复方案 #

方案1：通过Row的horizontalArrangement实现 #

去掉weight(1f)，利用Row的horizontalArrangement属性将元素推至右侧，同时用Alignment.Top满足垂直对齐要求：

Row(
    modifier = Modifier.fillMaxWidth(),
    horizontalArrangement = Arrangement.End
) {
    Button(
        colors = mainButtonColor,
        modifier = Modifier
            .align(Alignment.Top)
            .border(width = 2.dp, color = Color.Yellow)
            .shadow(3.dp),
        onClick = {},
    ) {
        // ...
    }
}

方案2：嵌套Box容器保留weight属性 #

如果需要保留weight(1f)，可以在Row内嵌套一个Box，Box的Modifier.align()支持完整的Alignment类型，从而实现右上角对齐：

Row(modifier = Modifier.fillMaxWidth()) {
    Box(
        modifier = Modifier
            .weight(1f)
            .fillMaxWidth()
    ) {
        Button(
            colors = mainButtonColor,
            modifier = Modifier
                .align(Alignment.TopEnd)
                .border(width = 2.dp, color = Color.Yellow)
                .shadow(3.dp),
            onClick = {},
        ) {
            // ...
        }
    }
}

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