如何移除Jetpack Compose中TextField的底部线条？

你看到的底部线条是TextField自带的默认装饰指示器，即便手动添加了自定义边框，这条默认线条依然会显示。可以通过以下两种方式移除：

方法一：将默认指示器颜色设为透明 #

通过TextFieldDefaults.textFieldColors，把聚焦、未聚焦甚至禁用状态下的指示器颜色都设为透明，既能保留自定义边框，又能消除默认线条：

TextField(
    value = text,
    onValueChange = { onValueChanged(it) },
    modifier = Modifier
        .fillMaxWidth()
        .height(100.dp)
        .padding(10.dp)
        .border(width = 1.dp, color = Color.Gray, shape = RoundedCornerShape(8.dp)),
    singleLine = false,
    placeholder = { Text("Enter some text here") },
    colors = TextFieldDefaults.textFieldColors(
        focusedIndicatorColor = Color.Transparent,
        unfocusedIndicatorColor = Color.Transparent,
        disabledIndicatorColor = Color.Transparent
    )
)

方法二：使用BasicTextField实现完全自定义 #

如果不需要TextField的默认装饰逻辑，直接用BasicTextField更轻量化，它本身不带任何默认线条，所有外观都由你自己控制：

BasicTextField(
    value = text,
    onValueChange = { onValueChanged(it) },
    modifier = Modifier
        .fillMaxWidth()
        .height(100.dp)
        .padding(10.dp)
        .border(width = 1.dp, color = Color.Gray, shape = RoundedCornerShape(8.dp))
        .padding(horizontal = 16.dp, vertical = 8.dp),
    singleLine = false
) { innerTextField ->
    Box {
        if (text.isEmpty()) {
            Text("Enter some text here", color = Color.Gray)
        }
        innerTextField()
    }
}

优先推荐第一种方法，它能保留TextField的默认交互逻辑（比如焦点状态处理），仅移除多余的底部线条。

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