如何在Jetpack Compose Row中让文本居中且图片居右带内边距

你的问题在于使用weight(1f)后，文本的居中范围被图片占用的空间压缩，导致视觉上无法真正相对于整个Row居中。以下是可行的解决方案：

实现代码 #

Row(
    modifier = Modifier
        .padding(horizontal = 20.dp)
        .shadow(8.dp)
        .background(Orange_Light, shape = shape)
        .fillMaxWidth(),
    verticalAlignment = Alignment.CenterVertically
) {
    Box(
        modifier = Modifier.fillMaxWidth(),
        contentAlignment = Alignment.Center
    ) {
        Text(
            modifier = Modifier.padding(vertical = 20.dp),
            text = "\uD83D\uDE4F\uD83C\uDFFBNamaste",
            textAlign = TextAlign.Center
        )

        Image(
            modifier = Modifier
                .height(40.dp)
                .align(Alignment.CenterEnd)
                .padding(end = 18.dp),
            painter = painterResource(id = R.drawable.ic_right_arrow),
            contentDescription = "右箭头图标"
        )
    }
}

原理说明 #

• 用Box填充整个Row宽度，Text在Box内居中，确保它的居中范围是整个Row的宽度，不受图片影响。
• Image通过align(Alignment.CenterEnd)固定在Box的右侧，同时设置右侧内边距，既保证位置正确，也不会干扰文本的居中布局。

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