androidandroid-jetpack-compose

How to change Jectpack Compose BasicTextField's text color?


I'm trying to make a search bar using BasicTextField.
The default text color is black and I couldn't find any option to change the text color.
Also I need to change the text size, font and other attributes.

@Composable
fun MyBasicTextField(){
    var text by remember { mutableStateOf("Hello") }
    BasicTextField(
        value = text,
        onValueChange = {
            text = it
        },
        decorationBox = { ... },
        modifier = Modifier
            .fillMaxWidth()
            .background(Color.DarkGray, CircleShape)
            .padding(10.dp)
    )
}

Jetpack Compose BasicTextField

If this is not possible through BasicTextField, is there any other approach to create similar view?
I have tried TextField but there was several problems like removing label, height, background...


Solution

  • You need textStyle parameter. If you prefer using default text style, use LocalTextStyle:

    BasicTextField(
        // ...
        textStyle = LocalTextStyle.current.copy(color = Color.White)
    )
    

    Or you can use one of material styles:

    BasicTextField(
        // ...
        textStyle = MaterialTheme.typography.body1.copy(color = Color.White)
    )