I’m using `androidx.compose.material3.ModalBottomS...

# compose

[Stylianos Gakis]

I’m using androidx.compose.material3.ModalBottomSheet, and I got a text field in there.
I want to if possible as soon as the modal sheet shows up, to have the text field to also acquire focus, and as a consequence have the keyboard show up.

With this I’ve found it more or less impossible to make it so that it happens at the same time. I need to have the modal show, and then after some arbitrary delay request the focus, otherwise it simply crashes saying that I am requesting focus before the focus target is set and so on.

Then I wanted to also have the keyboard to move away (as a consequence of removing the focus from that textField) when the modal is dismissed, only to find out that onDismissRequest from the modal is called after the modal is already out from the screen, so what happens visually is that the modal disappears, and then in 1 frame the keyboard shows completely, and then in the next frame it needs to disappear, making this entire thing look very jarring.

Anyone else has dabbled with something like this before? Might be that the API provided by the m3 modal sheet isn’t enough and I’d also want a callback for when the dismiss starts to happen, and not only when it’s already done to try and ask the keyboard to leave the view earlier?

[Zoltan Demant]

You might find some success in observing the ModalBottomSheetState, I think there was a way to calculate the "slide progress" which you could use to dismiss the keyboard when a certain threshold is met. You might be able to use this both ways, requesting focus when the pane is expanding as well 🙂 I havent actually played with this in M3, but it worked supremely well in M2.

[Stylianos Gakis]

Hmmm alright alright, let’s see if I can make it work for me, I haven’t tried looking into that so far. Thanks a lot!

[Stylianos Gakis]

Wow I’ve lost so many hours to this! https://issuetracker.google.com/issues/287152281
This is so subtle yet has already given me so much trouble these past few days.
Moving the LocalFocusManager.current inside the ModalBottomSheet lambda works. I was doing this

val fm = LocalFocusManager.current
ModalBottomSheet() {
  fm.clearFocus()
}

and it just didn’t work and I was about to go insane 😂

[Zoltan Demant]

Unfortunately, I can relate 😅

I guess that happens because the sheet content is rendered in a different window?

[Stylianos Gakis]

Yeah it must have its own local for this or something like that 🥴 Probably due to what you are saying