android - 如何删除 Jetpack Compose OutlinedTextField 上方的额外填充？

Question

我试图像这样在 Box 元素之后将 OutlinedTextField 放入 Column

@Composable
fun Header() {
    Column {
        Box(
            modifier = Modifier
                .border(1.dp, Color.Cyan)
        ) {
            Text("Header")
        }

        OutlinedTextField(
            modifier = Modifier
                .fillMaxWidth()
                .border(1.dp, Color.Cyan),
            value = "",
            onValueChange = {},
            placeholder = {
                Text("Enter header")
            }
        )
    }
}

添加边框以查看元素的确切大小。看起来像这样

上面有额外的 8dp 填充，但是当我使用 TextField 而不是 OutlinedTextField 时，没有额外的空间

@Composable
fun Header() {
    Column {
        Box(
            modifier = Modifier
                .border(1.dp, Color.Cyan)
        ) {
            Text("Header")
        }

        TextField(
            modifier = Modifier
                .fillMaxWidth()
                .border(1.dp, Color.Cyan),
            value = "",
            onValueChange = {},
            placeholder = {
                Text("Enter header")
            }
        )
    }
}

我需要知道它为什么会发生以及如何解决它
库的版本是“androidx.compose.material:material:1.0.0-alpha10”

Answer 1

OutlinedTextField 上方的填充是否存在，因为标签在聚焦时会移到顶部，这需要空间。

如果您不想要此功能，您可以通过修改 BasicTextField 创建自己的可组合的轮廓文本字段。 .