Hi, I have built a TextField composable that acts ...

# compose

[Lilly]

Hi, I have built a TextField composable that acts like a drop down field. I would like to place it in the trailing slot of a ListItem but due to its default minWidth of 280 dp I can't make it smaller without side effects. When I set the with of the TextField it behaves not like expected. The TextField will always fill a width of 280 dp no matter what width I apply. What options do I have here? Should I make an own version of TextField -> what basic composable would I use to build on?

[Siyamed]

If you can create a ticket with repro steps, a sample code and maybe your expectation it would be awesome

[Siyamed]

What are the side effects that you mentioned?

[Siyamed]

Oh, also right now for a few releases it doesnt have a default with in dp's but in number of chars, so it would ge good to update Compose as well

[Lilly]

@Siyamed I have previewed a simple TextField with a custom width. As you can see its parent container still takes its 280 dp no matter what width I have applied. It's not visivle but it still takes the space. That's the reason why in my screenshot above the TextField looks like centered but it's simple taking in the whole space which I described as side effect.

I would expect that its width matches the width I have applied. I'm using alpha09

[alorma]

Hey, can you share the component? 🙏 i wnt to use one in a project

[Lilly]

Sure

[Lilly]

You may have to adjust it. I'm expecting an string array for the possible selections

TextFieldDropDown

[alorma]

Would this work (adjusted) as a clickable TextField?

[Lilly]

Yes of course. You have to move the code within the trailingIcon slot out of the slot and remove this slot. Then you make your TextField clickable via the modifier. And in the clickable block you define the expanding logic. I have currently stress otherwise I would implement it for you

[Lilly]

If you don't get it to work, write me tomorrow, then I have time again

[Siyamed]

@Anastasia [G] if they have an idea in terms of min width on the material layer

[Siyamed]

hmm, yes (material) TextFields have min width defined

private val TextFieldMinWidth = 280.dp

[Siyamed]

in TextFieldImpl

[Siyamed]

@Lilly can you please create a ticket and share here? If you can share a minimal repro case it would be very helpful.

[Anastasia [G]]

There is a change in review already which removes the 280dp minimum width,

[Anastasia [G]]

So no need for a ticket

[Lilly]

As far as I know there will be a release tomorrow?

[Siyamed]

it wouldnt make it to tomorrow 🙂

[Lilly]

alright 🙂

[Siyamed]

since the releases are cut earlier

[Anastasia [G]]

and also it is not merged yet

[Lilly]

what options do I have until then?

[Lilly]

is there another TextField like component which is more based or should I build something custom with simple Text and Surface ?

[Siyamed]

there is a lower level component named BasicTextField

[Siyamed]

Not sure if the error repros there or if it works for your use case

[Siyamed]

BasicTextfield has a default width if no width is defined in number of chars (afaik it was 10), but it doesnt have a min/max etc width.

[Lilly]

Thanks a lot, I will check it