https://kotlinlang.org logo
#compose
Title
# compose
e

electrolobzik

02/28/2024, 4:04 PM
Hello, guys! In some cases it is required to change the parent composable behaviour from a child. For example there is a screen with bottom navigation and in some cases the child content should be showed fullscreen, without bottom navigation. Are there any options to implement it besides hoisting an interface for setting the state flag (showBottomNavigation) from the root to the child screens?
s

Sean Proctor

02/28/2024, 7:03 PM
I put the
Scaffold
in each screen and let each screen manage their own navigation UI.
e

electrolobzik

02/28/2024, 7:05 PM
@Sean Proctor So you don’t have just one place for bottom navigation and instead you can add it to any screen? How do you reduce duplication of code in this case, especially the callbacks? Do you call some global handler for the tab clicks?
s

Sean Proctor

02/28/2024, 7:06 PM
I have something like a composable
MyScaffold
that is called from each screen and everything shared is handled there, except for the screens that are fullscreen.
👍 1
e

electrolobzik

02/28/2024, 7:08 PM
Thank you! This architecture doesn’t fit well in my case, but it is a working approach in general.
r

Remi Latapy

02/28/2024, 8:40 PM
We use two (or more) navhosts. The first one contains the bottom nav bar + second navhost and fullscreen destinations. To navigate from a "nested" destination to a fullscreen destination, we have to pass the lambda from the outer navhost. Here is a sample I used to report an issue https://github.com/rlatapy-luna/Compose-Playground/tree/navigation/nested_nav
s

Stylianos Gakis

02/28/2024, 11:16 PM
Hoist the source of truth of when the bottom nav should be shown or not to a common ancestor. Having each screen have their own Scaffold also kinda works, but really looks like a mess when you want to navigate for example from a screen which has a scaffold with a bottom bar to another one that does too. Then the navigation animation will play on the bottom bar too, which is awkward. This is not a real solution while shared element transitions do not exist in androidx.navigation. Using two NavHosts for this problem is definitely not the right approach for this either. What we do is that we got a state object which derives this https://github.com/HedvigInsurance/android/blob/f959737715f5c74121ba21e1359346ef4c[…]app/src/main/kotlin/com/hedvig/android/app/ui/HedvigAppState.kt from the current nav destination. Then this is simply used above the NavHost https://github.com/HedvigInsurance/android/blob/df71aa56208acfeb9aa111f7a1d26be956[…]/app/app/src/main/kotlin/com/hedvig/android/app/ui/HedvigApp.kt so that we show the navigation bar/rail along with the content of NavHost accordingly.
e

electrolobzik

02/29/2024, 3:41 PM
thanks for the feedback!