Folks, I'm currently moving from React Native to Native Android (Jetpack Compose). I've made a custo...

# android

[Pascal Gerrist]

Folks, I'm currently moving from React Native to Native Android (Jetpack Compose). I've made a custom navigation bar and above the navigation bar I want to have my app contents. How can I make sure the content is of 100% height, minus the navigation bar? In the attached screenshot you see my navigation bar and a view (I gave the content view a height of 50% on the screenshot). Thank you

[Ciaran Sloan]

you can use the Scaffold API for that. The content lambda receives a PaddingValues which you can use to retrieve the padding of both top and bottom bars which are provided to the Scaffold

[Ciaran Sloan]

Scaffold(
        bottomBar = { MyBottomBar() }
    ) { paddingValues ->
        val bottomPadding = paddingValues.calculateBottomPadding()
        MyScreen(
            modifier = Modifier.padding(
                bottom = bottomPadding
            )
        )
    }

[Pascal Gerrist]

Made it work with scaffolding. Thank you so much @Ciaran Sloan! 🙂

[czuckie]

fwiw Pascal, if you're in that situation again with something like a Column or a Row, you can typically add a modifier.weight(1f) to the child you want to utilise the most space

[czuckie]

not for now, but just might come in handy at some point

[Pascal Gerrist]

Great @czuckie! Thank you

[Zach Klippenstein (he/him) [MOD]]

You might want to join #compose