Voyager: Navigation Solution for Compose Multiplatform - iOS and Android | Complete Guide
ฝัง
- เผยแพร่เมื่อ 3 ส.ค. 2024
- 🏆 My Online Courses
stevdza-san.com
📝 Writing on Medium
/ stevdza-san
☕ Let's get a coffee. You're paying! :)
ko-fi.com/stevdza_san
💻 Github
github.com/stevdza-san
📸 Instagram
/ stevdza_san
Voyager (Github): github.com/adrielcafe/voyager
Voyager (Website): voyager.adriel.cafe/
⌚Timestamps
0:00 - Introduction
1:04 - Create a basic KMP Template
2:26 - Basic Two-Screen + Arg Navigation
7:09 - Transition Animations
7:48 - Bottom Bar with Tabs
11:23 - Nested Navigation
Excellent helpful video! Thanks a lot!
Great video. Very helpful.
Thanks for showing how the new navigation library works. For me it is very helpful! 👍
I'm glad to hear that! 🙏
Amazing video.
That's great!
thanks for that content.
would like to hear you opinion about Circuit, from navigation and MVI perspective:)
I hope you create a complex course on multiplatform compose and voyager/decompose sir 🔥
Nice
A video on the ScreenModel would be great 👍
it is a pretty good library
does it work for web also ? Bcs when i used it to that the was some errors in the web page
Awesome video, thanks! I'm also wondering is it possible to send parameters from the App to a Screen and if so, how? Best regards!
I have used to using voyager navigation for 1.5 years
Doesn't passing data from screen to screen when navigating break the single source of truth principle? Isn't using shared viewmodel better to share data from screen to screen?
If you're using a bottom navigation bar with two tabs, home and settings, how do you navigate back to the home screen if you're on the settings screen, but the bottom nav bar is hidden while on the setting screen? I know that in the docs it says that tabs are siblings so TabNavigator doesn't support back handling, but I kinda need a workaround. Would this be a case for nested navigation?
I'm facing same issue, has anyone managed to do this?
Hello, in the examples you do not have a viewmodel. What should be the proper way to pass the arguments to the viewmodel when the viewmodel is initialized and you are using voyager?
Thx for the tutorial!
Good question. There are quite a few different solutions for KMP ViewModel, one of them is this one: voyager.adriel.cafe/screenmodel
If you're using bottom navigation with a home and settings tab, how do you navigate back to the home screen if you're on the setting screen while hiding the bottom navigation bar on the settings screen?
I had an issue , how can i hide bottom bar ? if i am on Profile screen and when navigates to Edit Profile screen how could i hide scaffold's bottom bar and top bar ? any solution please
Thanks for this video, can we use Koin DI library along with Voyager?
@nishu33389 Oh yeah, certainly! There's an extra artifact for that as well. Check the voyager official docs.
Hello, the author wants you to publish a cross-platform tutorial of Jetpack Compose PC.
Can you provide instructions on how to preview Voyager tabs that are using view models and need custom data?
By the way, I have this kinda problem:
I have 5 tabs: TabA, TabB. TabC, TabD, TabE and in each of them there is a possibility to navigate, i.e. I have inserted Navigator inside and can open screens there. The user clicked the button on TabA and went to Screen1. I need to be able to move Screen1 from any Tab by clicking a button to TabB, not the current stack of Tabs. Pardon me if this is a strange question, but I need help with this! I tried navigating through the tabs and after opening the screen but it didn't work.
Thanks for reading.
How can we get the current destination
Perfect video ❤🎉
But how can i hide my bottom navigation in my nested navigation
Create the state on the top of the hierarchy and observe and update it accordingly.
@StevdzaSan can you give an example?
Compare to decompose, what do you think about it?
It's pretty decent to me. 👌
Please also cover dependency injection in compose multiplatform.
Thanks for the suggestion!
Voyager also works for compose desktop.
I have got an scenario here! For example, In Screen A I called an API and fetched list, and when clicked on item of the list, i pushed to Screen B. when i come back from B to A, the API is called once again in Screen A, which i don't want. What i want here is that, it should save the previous instance of Screen A, just like in Activities. Anyone could hep me here?
Initialize a ViewModel inside the Screen A, and trigger that api function from there.
How to pop to screen A with data passing from B to A in voyager?
Watch the video.
In your video just pop from B to A without passing data to A again. What i asked is pop back with result.
I would also like to see example to pop with result
what if i want somescreens not to have bottombar
Then you detect the current screen and hide the bottom bar. :)
@@StevdzaSan how to do it i searched and did not get much info about voyager
@@_hudeifa23 same issue , suppose i am on profile tab , and want to navigates to edit Profile screen , how can i hide Bottom bar and top bar ? did you find solution ? please response
Voyager is a tempting library, with very nice 3rd party integration, however, lack of deep-linking support, is a no-go for some developers.
I would say easier than decompose.
Try to leave app and go back - you'll get IOException writing serializable object (name = quran.navigation.quran.MainScreen) exception. How could that be fixed?
Could you write the exact reproduction steps? Have you used a basic Home/Details navigation or Nested navigation with BottomBar/Tabs?
@@StevdzaSan thanks for answering. I fixed it. Problem was because I was sending inside of a contractor non-serializable parameter. Thank you for the good stuff (I meant videos)!