如何移除BasicTextField的下划线？无需更换TextField组件的解决方法

如果你使用的是官方Material库提供的TextField组件，不需要更换其他组件，只需要在组件的colors参数中，将所有状态下的下划线颜色设置为透明即可，示例代码如下：

TextField(
    value = value,
    onValueChange = { value = it },
    // 核心配置：把所有状态的下划线颜色都设为透明
    colors = TextFieldDefaults.textFieldColors(
        textColor = MaterialTheme.colors.primary,
        focusedIndicatorColor = Color.Transparent,
        unfocusedIndicatorColor = Color.Transparent,
        disabledIndicatorColor = Color.Transparent,
        errorIndicatorColor = Color.Transparent
    ),
    textStyle = TextStyle(
        fontSize = 16.sp,
        fontWeight = FontWeight.SemiBold,
        textAlign = TextAlign.Center
    ),
    modifier = Modifier
        .fillMaxWidth()
        .align(Alignment.Center),
    singleLine = true
)

如果你当前使用的是BasicTextField，它本身默认就没有自带下划线样式，你提供的代码中已经配置了textDecoration = TextDecoration.None，不会出现下划线效果。如果实际运行时仍有下划线，检查是否是外层容器、主题样式或者其他修饰符额外添加了底部边框。

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