https://kotlinlang.org logo
#compose
Title
# compose
l

Lilly

01/13/2021, 3:01 AM
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?
s

Siyamed

01/13/2021, 3:31 AM
If you can create a ticket with repro steps, a sample code and maybe your expectation it would be awesome
What are the side effects that you mentioned?
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
l

Lilly

01/13/2021, 1:13 PM
@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
a

alorma

01/13/2021, 4:45 PM
Hey, can you share the component? 🙏 i wnt to use one in a project
l

Lilly

01/13/2021, 4:49 PM
Sure
You may have to adjust it. I'm expecting an
string array
for the possible selections
a

alorma

01/13/2021, 4:52 PM
Would this work (adjusted) as a clickable TextField?
l

Lilly

01/13/2021, 5:04 PM
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
If you don't get it to work, write me tomorrow, then I have time again
s

Siyamed

01/13/2021, 5:29 PM
@Anastasia [G] if they have an idea in terms of min width on the material layer
hmm, yes (material) TextFields have min width defined
Copy code
private val TextFieldMinWidth = 280.dp
in TextFieldImpl
@Lilly can you please create a ticket and share here? If you can share a minimal repro case it would be very helpful.
a

Anastasia [G]

01/13/2021, 5:37 PM
There is a change in review already which removes the 280dp minimum width,
So no need for a ticket
👍 1
l

Lilly

01/13/2021, 5:37 PM
As far as I know there will be a release tomorrow?
s

Siyamed

01/13/2021, 5:37 PM
it wouldnt make it to tomorrow 🙂
l

Lilly

01/13/2021, 5:37 PM
alright 🙂
s

Siyamed

01/13/2021, 5:38 PM
since the releases are cut earlier
a

Anastasia [G]

01/13/2021, 5:38 PM
and also it is not merged yet
l

Lilly

01/13/2021, 5:38 PM
what options do I have until then?
is there another TextField like component which is more based or should I build something custom with simple
Text
and
Surface
?
s

Siyamed

01/13/2021, 5:40 PM
there is a lower level component named
BasicTextField
Not sure if the error repros there or if it works for your use case
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.
👍 1
l

Lilly

01/13/2021, 5:48 PM
Thanks a lot, I will check it
4 Views