jetpack compose 无法将搜索栏背景颜色设置为白色

Question

当我尝试将背景颜色设置为白色时，我有一个带有文本字段的搜索栏，它带有灰色，但是如果我将 Textfiled 更改为 BasicTexfield，我可以将其设置为其他颜色，只有白色不起作用，它工作正常，但无法设置图标顶部开始

@Composable
fun DoctorListScreen(
navController: NavController,
viewModel: DoctorListViewModel = hiltViewModel()
) {
Surface(
    color = Color.White,
    modifier = Modifier.fillMaxSize(1f)
) {
    Column {
        Spacer(modifier = Modifier.padding(top = 15.dp))
        SearchBar(
            hint = "Klinik ara..", modifier = Modifier
                .fillMaxWidth()
                .padding(15.dp)
        ) {
        }
        CheckGender(modifier = Modifier.padding(15.dp))

    }
}
}


@Composable
fun SearchBar(
modifier: Modifier = Modifier,
hint: String = "",
onSearch: (String) -> Unit = {},
) {

var text by remember {
    mutableStateOf("")
}

var isHintDisplayed by remember {
    mutableStateOf(hint != "")
}
Box(modifier = modifier) {
    TextField(value = text, onValueChange = {
        text = it
        onSearch(it)
    }, leadingIcon = {
        Icon(painter = painterResource(id = R.drawable.search), contentDescription = null)
    }, maxLines = 1,
        singleLine = true,
        modifier = Modifier
            .fillMaxWidth()
            .shadow(5.dp, shape = RoundedCornerShape(10.dp))
            .background(Color.White, shape = RoundedCornerShape(10.dp))
            .onFocusChanged {
                isHintDisplayed = it.isFocused != true && text.isEmpty()
            })
    if (isHintDisplayed) {
        Text(
            text = hint,
            color = Color.LightGray,
            modifier = Modifier.padding(horizontal = 50.dp, vertical = 16.dp)
        )
    }
}
}

它的样子：

背景和条形颜色都是白色，但看起来不同

Answer 1

在您的文本字段中添加这一行：

colors = TextFieldDefaults.textFieldColors(
    backgroundColor = Color.White)

Answer 2

移除背景修饰符：

//background(Color.White, shape = RoundedCornerShape(10.dp))

并使用：

 TextField(
         /* .... */
        shape = RoundedCornerShape(10.dp),
        colors = TextFieldDefaults.textFieldColors(backgroundColor = Color.White),
 )