I have a bottom nav that is drawing under the navi...

# compose

[Colton Idle]

I have a bottom nav that is drawing under the navigation bar. To fix this, I thought all I had to do was add navBarPadding

BottomNavigation(
    modifier = Modifier.navigationBarsPadding(),

which "works" so that my bottom bar isn't behind the system nav, but now I'm seeing elevation like my bottombars height wasn't actually changed. Still working on a minimal repro (happening in my actual project currently), but has anyone encountered this before?

Before and after attached

[Colton Idle]

Alright, found this: https://github.com/google/accompanist/blob/main/insets-ui/src/main/java/com/google/accompanist/insets/ui/BottomNavigation.kt

Added this composable but named it "InsetAwareBottomNav" and I replaced my BottomNav with InsetAwareBottomNav with the same results.

[Colton Idle]

Okay! Figured it out.

I didn't realize that Accompanist had an inset artifact AND inset-ui artifact.

Add the inset-ui artifact, then swap the import from the material bottomnav to the accompanist bottomnav.

Then just add a new arg called contentPadding as seen below:

BottomNavigation(
    contentPadding = rememberInsetsPaddingValues(
        insets = LocalWindowInsets.current.navigationBars,
    )
) {
    // content
}

Also, for anyone that stumbles upon this... inset-ui also includes a scaffold! I don't actually know what the difference is in the scaffold since it looks like you still have to apply insets yourself onto bottomnav and topappbar... Maybe chris banes can fill me in if I'm missing something.