[FIXED] How to correctly set height in TextField in Jetpack Compose?

Issue

So I have this textfield,

var value = remember { mutableStateOf("") }

OutlinedTextField(
    value = value.value,
    placeholder = {
        Text("Search Users")
    },
    singleLine = true,
    modifier = Modifier.height(40.dp),
    onValueChange = {
        value.value = it
    },
)

I am setting height to 40.dp as you can see. However it looks like this,

Looks like the text/placeholder is cut off. How to fix this?

Solution

See the problem is that the font size is too big for the provided height. The correct way to provide a height for the field is using the modifiers as you already are doing. However, to work around this problem either increase the height of the text field or decrease the size of the font.

Answered By - Richard Onslow Roper
Answer Checked By - Dawn Plyler (JavaFixing Volunteer)