Hey guys, I had a question. Does anybody knows why

TextField

has some sort of padding, that causes the content cut (Please look at attached image)? And how I can eliminate it? Just please consider I don’t want to decrease font size or increase the height of

TextField

or

OutlinedTextField

to match the content. I am looking for another way. I also tried

Modifier.padding

on the textField and didn’t matter. Thank you in advance.

Did you set a hardcoded height on this text field? Material variant comes with built in vertical paddings, so reducing the overall height will cause the content to get clipped.

Yes. I’ve set a hardcoded height. Because the default height is much and the UI isn’t impressive. When I removed the hardcoded height, the output was like the image attached ⬇️

Material is a specific opinionated design system. If you're looking for more fine grained control, at some point you'll need to take over and create your own composeable(s).

This is disappointing. I hoped to find a standard way to do that. But it seems there is no way. Create a custom composable maybe time consuming. Anyway, Thank you for your responses. That was great help. 🙏

One the more important goals of Compose is to make it easy to build your own components by providing the right building blocks.

I don't know if this is related, but I had some similar issue https://kotlinlang.slack.com/archives/C01D6HTPATV/p1616079420040300

Thank you. Yes, It seems the same problem. I found that extra margins may reserved for decorations. Because I can not see this problem in the

BasicTextField

. I followed-up the source code of the

TextField

and I have realized that decorations, label and … need some room, and the this margin reserved for them. Also, in the Material them guidelines, it seems a standard behavior, although I don’t like it.