With enableEdgeToEdge() the height of the system n...

# compose-android

[bryankeltonadams]

With enableEdgeToEdge() the height of the system navBar (Gesture Navigation bar or three button navigation) is included in a Scaffolds padding values. 24dp for the Gesture Navigation and 48dp for the 3 button navigation. So I have a main Scaffold in my App which has a SnackBarHost so that I can have global snackbars, and then in my Scaffold content I have a Box which is using the scaffold innerPadding and then

.consumeWindowInsets(padding)

after that. Inside the box is my NavHost which is set to fillMaxSize() and then I have screen composables which have their own Scaffold which fillMaxSize, and then I have a bottomBar. This bottomBar on the nested Scaffold won't go edgeToEdge no matter what I do. If I stop passing the padding from the first Scaffold to the Box I can see the color of the second scaffolds bottomBar bleed into the navigationBar like I was wanting, but obviously the scaffoldPadding isn't being used which throws a warning. Any ideas?

[bryankeltonadams]

MainActivity.kt

MainActivity.kt

[bryankeltonadams]

Am I just supposed to remove my top level Scaffold, and then just put the SnackbarHost and NavHost in a Box together?

[Stylianos Gakis]

Scaffold in a scaffold really sounds like making your life harder for no reason.
I'd remove the outer scaffold for sure. That way you allow your NavHost to go edge to edge, therefore each screen can decide what they do themselves.

What we do is that we have top level that NavHost, and conditionally a bottom nav, a nav rail, or nothing. Then when those show, they simply consume the necessary insets and that's it. Then the inner NavHost can just use the right modifiers that use the insets if they're there, and do nothing if there consumed already.
Here's the code https://github.com/HedvigInsurance/android/blob/develop/app/app/src/main/kotlin/com/hedvig/app/feature/loggedin/ui/LoggedInActivity.kt#L253-L376

[bryankeltonadams]

Thanks Stylianos, I thought I could have used the scaffold as a nice little container for my snackbarHost and anything I wanted to be a global component at the app level, but since I want Scaffolds per screen it seems like I should go refactoring away from this. I'm guessing I'll probably want to handle insets on a per screen level if I'm wanting to give safe padding insets to most scaffold content, but exclude the imePadding from my bottom bars? (So that my bottom bar doesn't get pushed up when the keyboard is opened)

[Stylianos Gakis]

Yeah each screen can handle their own insets, it's by far the simplest approach. If you don't want to use the ime insets, then just don't ask for them, it should be as simple as that I would hope 😄