I have a search bar with textfield when I try to set background color to white it comes with gray but I can make it to other colors only white not working if I change Textfiled to BasicTexfield it works fine but can't set the Icon top start
@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)
)
}
}
}
how it looks like :
both background and bar color is white but seems different
CodePudding user response:
Remove the background modifier:
//background(Color.White, shape = RoundedCornerShape(10.dp))
and use:
TextField(
/* .... */
shape = RoundedCornerShape(10.dp),
colors = TextFieldDefaults.textFieldColors(backgroundColor = Color.White),
)
CodePudding user response:
Add this line in your Textfield:
colors = TextFieldDefaults.textFieldColors(
backgroundColor = Color.White)