Jetpack Compose中如何修改TextField背景颜色？已尝试多种方法无效

方案1：使用TextFieldDefaults.colors设置containerColor #

Material3中，TextField的背景色通过containerColor参数控制，替代了Material2里的backgroundColor。以OutlinedTextField为例：

OutlinedTextField(
    value = text,
    onValueChange = { text = it },
    label = { Text("输入内容") },
    colors = TextFieldDefaults.colors(
        focusedContainerColor = Color.LightGray, // 聚焦时背景色
        unfocusedContainerColor = Color.White, // 未聚焦时背景色
        disabledContainerColor = Color.Gray // 禁用时背景色
    )
)

Filled风格的TextField（Material3默认样式）同样适用该参数。

方案2：结合Modifier.background与clip处理透明背景 #

如果直接设置containerColor = Color.Transparent无效，可能是默认装饰框的背景未被完全覆盖，可通过Modifier.background配合clip实现：

OutlinedTextField(
    value = text,
    onValueChange = { text = it },
    label = { Text("输入内容") },
    modifier = Modifier
        .background(Color.Transparent, shape = MaterialTheme.shapes.medium)
        .clip(MaterialTheme.shapes.medium),
    colors = TextFieldDefaults.colors(
        focusedContainerColor = Color.Transparent,
        unfocusedContainerColor = Color.Transparent
    )
)

需同时将containerColor设为透明，再通过clip匹配TextField默认的圆角形状，确保背景完全透明。

方案3：自定义TextField装饰框 #

若上述方法均无效，可通过decorationBox完全自定义外层容器，摆脱默认样式限制：

TextField(
    value = text,
    onValueChange = { text = it },
    label = { Text("输入内容") },
    decorationBox = { innerTextField ->
        Box(
            modifier = Modifier
                .background(Color.Blue, shape = RoundedCornerShape(8.dp))
                .padding(horizontal = 16.dp, vertical = 12.dp)
        ) {
            innerTextField()
        }
    },
    colors = TextFieldDefaults.colors(
        focusedContainerColor = Color.Transparent,
        unfocusedContainerColor = Color.Transparent
    )
)

通过自定义装饰框直接控制背景、内边距和形状，完全替代默认的装饰逻辑。

注意：确保使用较新版本的androidx.compose.material3:material3依赖，旧版本可能存在参数命名不一致的问题。

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