A modern programming language that makes developers happier.

kotlinlang

ScreenRecording2024-03-21at11.13.16am-ezgif.com-video-to-gif-converter.gif

I'm using material3 and having trouble maintaining the single line format. When using a placeholder, suffix, and label - the animation of the label moving from inside to on top of the textfield briefly causes it to render as multiline.

Is there a way to prevent this using some combination of modifiers / similar? thanks for the help!

```OutlinedTextField(
        value = value,
        onValueChange = onValueChange,
        label = { Text(text = label) },
        suffix = { Text(text = inputSuffix) },
        placeholder = { Text(text = placeHolder) },
        modifier = Modifier.widthIn(max = 100.dp),
        singleLine = true,
        keyboardOptions = KeyboardOptions(
            keyboardType = KeyboardType.Number,
            imeAction = imeAction
        ),
        keyboardActions = keyboardActions,
    )```

Do you have a reproduction of that? It doesn't look normal. I would guess that the way the width is constrained is causing the issue.  You could try setting `maxLines = 1` on the text in the label, suffix, and placeholder. if it's M3, the height is supposed to be 56 DP, so you could just set that if everything else fails.

ahh good call - adding maxLines to the Text composable for the label fixed it
```label = { Text(text = "Label", maxLines = 1) }```
In that case, seems like the singleLine parameter in the OutlinedTextField composable only applies to the value itself (not the label, suffix, etc.)

There's no composition local for `maxLines`. You need to set that in the `Text`. It's weird that the width of the label is shorter during animation than at the start or end. It might be a bug.

&gt;  it's weird that the width of the label is shorter during animation
yea... I think it happens because the suffix inside the textfield takes up some of the width (whereas when the label is on the outline, it can take the full width)