3

Quick question here:

Is this a bug inside jetpack compose TextField or am I missing something:

@Composable
fun TextFieldWithPlaceholder() {
    val text = rememberSaveable {
        mutableStateOf("")
    }
    Box(modifier = Modifier
        .fillMaxSize()
        .background(MaterialTheme.colors.background)) {

        TextField(
            modifier = Modifier
                .background(Color.Blue)
                .size(width = 300.dp, height = 50.dp),
            value = text.value,
            onValueChange = { value ->
                text.value = value
            },
            singleLine = true,
            colors = TextFieldDefaults.textFieldColors(
                backgroundColor = Color.Transparent,
                focusedIndicatorColor = Color.Transparent,
                unfocusedIndicatorColor = Color.Transparent,
                focusedLabelColor = Color.Transparent,
                unfocusedLabelColor = Color.Transparent,
                placeholderColor = Color.Red,
                cursorColor = Color.White
            ),
            placeholder = {
                Text(
                    modifier = Modifier.fillMaxWidth(),
                    textAlign = TextAlign.Center,
                    text = "Placeholder"
                )
            },
            textStyle = MaterialTheme.typography.body2.copy(textAlign = TextAlign.Center)
        )
    }
}

If you build the project with this composable, and tap inside the input field, you'll notice that the cursor is behind the placeholder text (talking about the Z axis). Parts of the cursor are not visible due to "Placeholder" text being on top of it.

Is there a way to force it to be on top of placeholder?

Thanks in advance

Bojan Antić
  • 63
  • 7
  • Tried your code and the placeholder is working as expected. The cursor is displayed in the middle of the textfield, over the placeholder text. – Manu Jan 10 '23 at 16:04
  • Maybe i did not express my self correctly. Im talking about Z axis. Is the cursors behind the "Placeholder" text on the Z axis? I have tried on multiple devices, its always behind, parts of cursor are not visible because of the text being on top of it. – Bojan Antić Jan 11 '23 at 10:51

0 Answers0