Jetpack Compose中移除垂直内边距后如何让OutlinedTextField内容垂直居中？

不用嵌套Column，直接调整OutlinedTextField的核心参数就能搞定——之前用Column包裹DecorationBox会破坏它内部的布局逻辑，才导致外观异常。具体做法如下：

核心思路 #

1. 修改contentPadding：直接把垂直方向内边距设为0dp，保留水平方向的11dp。
2. 文本垂直居中：通过textStyle设置文本的垂直对齐方式，弥补去掉垂直内边距后的对齐问题。
3. 复用原生DecorationBox逻辑：不要替换或嵌套DecorationBox，直接传递修改后的参数即可，它本身已经处理了标签、输入框、交互状态的布局逻辑。

完整代码示例 #

@Composable
fun CustomCenteredOutlinedTextField(
    value: String,
    onValueChange: (String) -> Unit,
    label: @Composable () -> Unit,
    modifier: Modifier = Modifier,
    singleLine: Boolean = true,
    leadingIcon: @Composable (() -> Unit)? = null,
    trailingIcon: @Composable (() -> Unit)? = null
) {
    val adjustedContentPadding = PaddingValues(
        horizontal = 11.dp,
        vertical = 0.dp
    )

    OutlinedTextField(
        value = value,
        onValueChange = onValueChange,
        label = label,
        modifier = modifier,
        singleLine = singleLine,
        textStyle = LocalTextStyle.current.copy(
            verticalAlignment = Alignment.CenterVertically
        ),
        contentPadding = adjustedContentPadding,
        interactionSource = remember { MutableInteractionSource() },
        decorationBox = { innerTextField ->
            TextFieldDefaults.OutlinedTextFieldDecorationBox(
                value = value,
                visualTransformation = VisualTransformation.None,
                innerTextField = innerTextField,
                placeholder = null,
                label = label,
                leadingIcon = leadingIcon,
                trailingIcon = trailingIcon,
                singleLine = singleLine,
                enabled = true,
                isError = false,
                interactionSource = interactionSource,
                contentPadding = adjustedContentPadding
            )
        }
    )
}

关键点说明 #

• 别嵌套额外布局容器：TextFieldDefaults.OutlinedTextFieldDecorationBox内部已经包含标签、输入文本、图标的排版逻辑，用Column包裹会干扰它的测量和布局，导致标签偏移、边框变形等问题。
• 多行文本的适配：如果是多行场景，去掉singleLine = true后，可以给OutlinedTextField添加modifier.heightIn(min = 48.dp)（或你需要的高度），同时保持textStyle.verticalAlignment = Alignment.CenterVertically，也可以结合lineHeight优化多行文本的垂直居中效果。
• 参数保持一致：确保OutlinedTextField和DecorationBox的contentPadding是同一个值，避免出现内边距不匹配的情况。

内容的提问来源于stack exchange，提问作者c-an