如何在 Jetpack Compose 中将文本垂直居中、顶部、底部对齐？

Question

如何使用可组合函数垂直对齐文本Text。有没有一种方法可以做到这一点，而不必添加另一个额外的视图来包含Text.

textAlign的参数只有Text以下选项：

TextAlign.

• 左边
• 正确的
• 中心
• 证明合法
• 开始
• 结尾

我尝试过使用textAlign = TextAlign.Center，但它只能水平居中。如何将其垂直居中而不将其包装在另一个视图中？

Text(
    text = "Text",
    modifier = Modifier.size(100.dp),
    textAlign = TextAlign.Center
)

结果：

我想要实现的目标：

Answer 1

您必须使用父容器并对齐其中的可组合项。

例如Box：

Box( 
    modifier = Modifier.fillMaxSize(),
    contentAlignment = Center
) {
    Text(
        text = "Text",
    )
}

或Column：

Column(
    modifier = Modifier.fillMaxSize(),
    verticalArrangement = Arrangement.Center,
    horizontalAlignment = Alignment.CenterHorizontally
) {
    Text(
        text = "Text",
    )
}

Answer 2

首先使用.wrapContentHeight()in 修饰符，然后可以使用align(CenterVertically)param 使文本居中。

Answer 3

在没有看到你的代码的情况下很难给出准确的答案，但我想说你需要使用容器Alignment.CenterVertically而不是TextAlign

就像是：

Row {
    Text(
        text = "Text",
        modifier = Modifier.align(alignment = Alignment.CenterVertically)
    )

    Image(
        ...
    )
}

或者：

Column(
    modifier = Modifier
        .align(Alignment.CenterVertically)
) {
    Text(text = "Text")
    Text(text = "Text 2")
}