My app has 4 tabs at the bottom. On Tab1Screen I'm using a ModalBottomSheetLayout, but the "Modal" shows beneath my tabs. Is there a way to change the "z-index" of my Modal so that it shows up on top of my bottom tabs so that it's a "proper" modal?

How about hiding the tabs when Modal is visible and showing it when disposed ?

The only issue I have with that is that the modal state lives in Tab1Screen and not at the top most level with the navigation.

Can you use a

compositionLocal

to control the bottomBar visibility ? or an activity scoped viewModel with a state in it? I don’t know if that’s the best way, but it’ll work i guess.

Since you can never have 2 modals displayed at the same time why not just have 1 modalbottomsheet at the root of the layout?

I was taking Ians advice of treating a modal bottom sheet as being on the same level as the screen that I actually want it to be present on. Essentially, picture a time picker, but its in a bottom sheet format. So in this case, having a modal bottom sheet of a time picker that is at the root is more tricky than just having it on the actual screen that needs the return value. Hopefully that made sense. @theapache64 maybe a composition local is the best way out of this. hm. will have to look that up.

It makes sense but it couples everything. There's no way to change z index it's relative to current parent only 😞

gotcha. maybe ill try to pass in the state of the bottom bar visibility into every screen, and then each screen could just switch that state whenever they need.

We do have the similar use-case in our app and solve it with using “Popup” composable for bottom sheet content, which effectively covers the whole screen, you can check this thread: https://kotlinlang.slack.com/archives/CJLTWPH7S/p1639396923060800 Recently we found a bug in “Popup”, so we create our own solution (based on Popup), which always lays out fullscreen and fixes our issues, you may found this snippet useful: https://kotlinlang.slack.com/archives/CJLTWPH7S/p1643849367173429?thread_ts=1643363349.401339&cid=CJLTWPH7S Basically the idea is to add a new “View” to the view hierarchy with match parent dimensions and render a bottom sheet content there. We also have some custom

BottomSheetDialog

wrapper, which adds dim & swipe support so our “FullscreenPopup” looks & behaves like bottom sheet.

Ooooh! Thanks for sharing. This sounds like exactly the route I might want to take.