Hi everyone, I'm using Compose Destination and I h...
# compose-destinations
t
Hi everyone, I'm using Compose Destination and I have a problem: • RootGraph contains LoginScreen, HomeScreen, SettingScreen,... • HomeScreen contains a bottomsheet with some screens: Bts1, Bts2,... • From Bts2 I can navigate to the screen in RootGraph, like SettingScreen. Does anyone know the best practice for this situation?
s
What is not working for you in this scenario? When you go to “SettingsScreen” do you want
HomeScreen
to be in the backstack or not? If not can you not pop up to that one (including that one) when you navigate to Settings?
t
Following the documentation, I must create a new DestinationNavHost for my HomeScreen bottom sheet. But inside the BtsScreen2, the DestinationNavigator can not navigate to SettingScreen, because SettingScreen is in RootGraph, and BtsScreen2 is in HomeScreenBtsGraph.
And the HomeScreenBtsGraph is nested in RootGraph
s
Not super familiar with how compose-destinations abstracts this, but anything can navigate to anything really, and if it’s not visible to it at that level since it’s in another module or anything like that, what should be happening is that it should be receiving a lambda that is just like
navigateToSettings: () -> Unit
and in the place where you can see both destinations you should be hooking up the right thing on that lambda. Kinda like what this https://developer.android.com/guide/navigation/integrations/multi-module describes. Now it is true that I am not sure how all this interacts with the bottom sheets too, but can you not pop it like you would any other normal destination?
😇 1
t
I handle this situation by passing callback from HomeScreen to its bottomsheets and it's ok now.
r
Hey @Tung97 Hl! I think the issue here is that you are using a second DestinationsNavHost inside HomeScreen. That is when the navigator from this NavHost cannot navigate to destinations that belong to the other NavHost. Otherwise, like @Stylianos Gakis said, you are always able to navigate to whatever destination that also belongs to the same "NavHost Graph". Usually, one NavHost is enough for most apps. Is there a reason you wanted a second one?
You mentioned it was due to documentation, I assume you're referring to this part?
But note that the sample code in there mentions the NavHost only because you have to do some work in your NavHost. It doesn't mean you have to create a second one.
In case you do have to have more than one NavHost, you need to pass lambdas or the navigator to HomeScreen, then make use of that one to navigate to the "outer" graph, instead of using the one from the "inner" NavHost. This is not unique to Compose Destinations, we're not even abstracting anything, it's just how jetpack navigation works.
t
Yes. Can you give a some suggestions to implement a bottomsheet navigation without create any extra NavHost? Thank you so much
r
You can just navigate to bottom sheet destination as you would to any other destination. You just need to do what's described in that doc link (I posted above) and you're good to go.
When it mentions DestinationsNavHost, you should consider the DestinationsNavHost you already have, no need to create a new one 🙂
t
I'm using ModalBottomSheetLayout from material2. I need to set the sheetContent so I dont know how to deal with it without create another NavHost
Like this
r
Of course, that is one of the steps described in documentation 👍
just do that in your other NavHost instead of creating a new one 🙂
the ModalBottomSheetLayout import is this one:
import com.google.accompanist.navigation.material.ModalBottomSheetLayout
btw.
ahh wait, I'm confused
That seems like a general bottom sheet? 🤔
Are you using
@Destination(style = DestinationStyleBottomSheet::_class_)
?
sorry @Tung97 Hl, before anything else, you need to decide what type of bottom sheet to use. • If you use the Material 2 one, this is just a bottom sheet that will show or hide ( based on a state) inside a given navigation destination. This one does not stay in the back stack, there's no ViewModel associated with it, etc. If you use this approach, it has nothing to do with navigation. • If you want to register a bottom sheet destination such that you can navigate to it, have its own ViewModel, enable process restoration to that bottom sheet, etc, then you use Compose Destinations and the link I sent above to do it. Do not mix these two things, they're very different 🙂
t
I got your point. I modified my code using the accompanist library. This code should work, right? 😀
r
I'm not sure.. if you're using the "register the bottom sheet as a navigation destination" approach, then I would expect this ModalBottomSheetLayout to be wrapping your main Composable, like the DestinationsNavHost you have already 🙂
t
I will try it again. At least I know I'm on the right way. Thank you for your help. Very cool library 😇
I make it work with one single NavHost after reading the instructions carefully. Now I have a new challenge: I can not make bottom sheet screens navigate to each other without closing/reopening the bottom sheet. This behavior is automatic I think because I annotated bottom sheet screens with DestinationStyleBottomSheet. Can you give me some suggestions? @Rafael Costa
r
What exactly are you trying to achieve? You would want just to swap the composable rendered in the bottom sheet without closing opening?
t
That right
r
You can achieve that just by having a compose state inside the first bottom sheet and when you want to change content you change that state
t
I have already overrided
Copy code
defaultAnimationsForNestedNavGraph
but nothing change
r
Then you have an if (or when) statement that checks current state and shows one or the other
In this case, you just get one navigation destination
And inside it, you show multiple contents depending
t
Got it. So we can not use DestinationsNavigator to swap content between bottomsheet screens
r
I mean.. you probably could.. but in that case the content itself is not a bottom sheet
And it’s just q lot of complication that you probably don’t need
Just swapping content based on state it’s a much easier way to solve this 🙂
t
Okay. Thank you so much. Have a nice day 😀
I have finished integrating Compose Destination into my project. Everything works well. Thank you for the great library.
👍 1
🙌 1