androidandroid-jetpack-composetextfield

How to remove TextField bottom line in Jetpack compose

here is my code:

TextField(
        value = text,
        onValueChange = { onValueChanged(it) },
        modifier = Modifier
            .fillMaxWidth()
            .height(100.dp)
            .padding(10.dp)
            .border(width = 1.dp, color = Color.Gray, shape = RoundedCornerShape(8.dp)),
        singleLine = false,
        placeholder = { Text("Enter some text here") }
    )

It works fine, but I got a bottom line out of the border area. How to remove this line?

Solution

  • The OutlinedTextField offers exactly what you would like to achieve:

    It's part of Material2 & Material3. For more details see https://m3.material.io/components/text-fields/overview#38269950-ca0b-40b3-a884-64dfac22a1ef