I'm looking for a way to show a Modal BottomSheet ...
# compose
c
I'm looking for a way to show a Modal BottomSheet in a way that doesn't force it to be in my view hierarchy in any way. I'm currently using ModalBottomSheetLayout but that does show in LayoutInspector, so I'm curious if I can use Compose to do that. If not and I really want a modal (different Window) then I suppose the only thing left to do is use https://material.io/develop/android/components/bottom-sheet-dialog-fragment ?
i
I'm getting some vibes of https://xyproblem.info/ - can you explain what problem you're trying to solve?
1
c
I've been using a debug drawer as shown in Jake Wharton's u2020 https://github.com/JakeWharton/u2020 but having the drawer in my view hierarchy has given me a few issues in terms of view focus (android tv and a11y). Now that I'm moving my app to Compose I want to show a debug drawer in a new "Window" so that it's completely isolated. So I'm considering dropping my debug drawer into a bottom sheet modal.
i
What makes you think those view focus issues exist in Compose? Wouldn't you rather those problems be fixed rather than warp the structure of your app?
s
You can create your own bottomsheet layout, and put condition to show or hide that ways it will not shows in LayoutInspector when it's hidden.
a
Need a debug drawer?
c
@ Ian, I guess the ask from my team has really been "Hey, we have a debug drawer and it messes with our testing during development time because it sometimes gives different results than our release builds. Wouldn't it be nice if we didn't have this debug drawer that sits in our view hierarchy" I can definitely see this being an xy problem, but I still think it's somewhat valid to ask if there is any way to show a proper modal/Dialog (whatever opens in a separate Window) with the bottom sheet apis in Compose or do I have to go the route doing that via the view based system.
j
I totally agree, there should be a way to show a bottom sheet globally. I think what I'm working on rn should help you, but not sure when it's done as I'm only doing it on the side
@Colton Idle I think essentially you'd want something like this: https://gist.github.com/jossiwolf/0b319eb45a93db5ced91365b277867e4 Only with code that is... not that code😄
c
OooOh! Thanks Jossi. Yeah. We might be going a little off of the path of where I originally brought this question up (and hence Ians concern of "what am I actually trying to do") but the fact that I need to have a bottom sheet as the root composable just doesn't feel right. I thought there would be a way to just somehow show a modal. Not sure how "dialogs" work in compose yet, but maybe I should try that too.
This sentence particularly from material docs really sells me on completely getting rid of
Dialogs
in my app and just replacing it with bottom sheet dialogs (if there was an easy way to go about it)
`BottomSheetDialogFragment`s are a more modern version of Dialogs. They have a nicer-looking entrance animation and since they are pinned to the bottom they may feel easier to use on larger devices.
j
Yeah, I think Ian's first question is totally pushing you in the right direction This might just be a very special case where your host is variable depending on your root config (which you can do at a top level too, it's just harder/less nice)
s
@Colton Idle I'm using Bottom Sheet as separate Composable, it's not pretty by no means. but I'm think creating custom Sheet is simple in Compose which I'm not using here. https://gist.github.com/shakil807g/451958e2cee0d26527467b8aba12c443
👍 1
c
@jossiwolf yeah for now I'm just using the view based
val bottomSheetDialog = BottomSheetDialog(this)
and it doesn't affect my current view hierarchy since it opens in a Window so I'll be using this for now. I hope that compose ends up having a solution for it so that i can ditch xml land completely.
j
@Colton Idle Yup, that probably makes the most sense for now. I'll ping you when I have a working (aka not crashingblob joy) prototype for it, shouldn't be long 🙂
👍 3