Voyager: Navigation Solution for Compose Multiplatform - iOS and Android

Voyager: Navigation Solution for Compose Multiplatform - iOS and Android | Complete Guide

Рет қаралды 5,941

Күн бұрын

🏆 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

Пікірлер: 51

@siarheisudakou4455 5 ай бұрын

Excellent helpful video! Thanks a lot!

@AdrianMaenzanise 3 ай бұрын

Great video. Very helpful.

@legato0 5 ай бұрын

Thanks for showing how the new navigation library works. For me it is very helpful! 👍

@StevdzaSan 5 ай бұрын

I'm glad to hear that! 🙏

@2space23 Ай бұрын

Amazing video.

@user-tz4fx7dw3p 5 ай бұрын

That's great! thanks for that content. would like to hear you opinion about Circuit, from navigation and MVI perspective:)

@HambaAllah-cd9im 5 ай бұрын

I hope you create a complex course on multiplatform compose and voyager/decompose sir 🔥

@eugenewainaina5626 5 ай бұрын

Nice A video on the ScreenModel would be great 👍

@NoPainInLife 4 ай бұрын

does it work for web also ? Bcs when i used it to that the was some errors in the web page

@AbdallahMehiz 5 ай бұрын

it is a pretty good library

@dleonardo3238 5 ай бұрын

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?

@muckalica96 2 ай бұрын

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!

@goooozy 5 ай бұрын

I have used to using voyager navigation for 1.5 years

@harryg6843 4 ай бұрын

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.

@troopell 5 ай бұрын

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?

@aditya3n 4 ай бұрын

I'm facing same issue, has anyone managed to do this?

@user-sl2ev5jj3p 5 ай бұрын

Hello, the author wants you to publish a cross-platform tutorial of Jetpack Compose PC.

@troopell 5 ай бұрын

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?

@ayushrai3266 13 күн бұрын

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

@codewithluca 5 ай бұрын

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!

@StevdzaSan 5 ай бұрын

Good question. There are quite a few different solutions for KMP ViewModel, one of them is this one: voyager.adriel.cafe/screenmodel

@ramtin4842 5 ай бұрын

Can you provide instructions on how to preview Voyager tabs that are using view models and need custom data?

@mi_coder8637 Ай бұрын

How can we get the current destination

@nishu33389 28 күн бұрын

Thanks for this video, can we use Koin DI library along with Voyager?

@StevdzaSan 28 күн бұрын

@nishu33389 Oh yeah, certainly! There's an extra artifact for that as well. Check the voyager official docs.

@frankyjunior6005 5 ай бұрын

Compare to decompose, what do you think about it?

@StevdzaSan 5 ай бұрын

It's pretty decent to me. 👌

@myexperience8630 3 ай бұрын

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?

@StevdzaSan 3 ай бұрын

Initialize a ViewModel inside the Screen A, and trigger that api function from there.

@kamelkiko7742 5 ай бұрын

Perfect video ❤🎉 But how can i hide my bottom navigation in my nested navigation

@StevdzaSan 5 ай бұрын

Create the state on the top of the hierarchy and observe and update it accordingly.

@kaustuvmahanti5209 5 ай бұрын

@StevdzaSan can you give an example?

@Shreyas-fs3dp 5 ай бұрын

Please also cover dependency injection in compose multiplatform.

@StevdzaSan 5 ай бұрын

Thanks for the suggestion!

@MichaKrasowski 7 күн бұрын

Voyager is a tempting library, with very nice 3rd party integration, however, lack of deep-linking support, is a no-go for some developers.

@efeegbevwie9467 5 ай бұрын

Voyager also works for compose desktop.

@frankyjunior6005 5 ай бұрын

How to pop to screen A with data passing from B to A in voyager?

@StevdzaSan 5 ай бұрын

Watch the video.

@frankyjunior6005 5 ай бұрын

In your video just pop from B to A without passing data to A again. What i asked is pop back with result.

@codeMasterSerbia 5 ай бұрын

I would also like to see example to pop with result

@chax255 2 ай бұрын

I would say easier than decompose.

@_hudeifa23 4 ай бұрын

what if i want somescreens not to have bottombar

@StevdzaSan 4 ай бұрын

Then you detect the current screen and hide the bottom bar. :)

@_hudeifa23 4 ай бұрын

@@StevdzaSan how to do it i searched and did not get much info about voyager

@ayushrai3266 13 күн бұрын

@@_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

@GongCheng-h4l Күн бұрын

@@ayushrai3266Using Navigator(MainSceen()) which in MainScreen() 's content, you can add TabNavigator with bottom tabs, and then in Tab content, using LocalNavigator.current.parent (the parent navigator which we add in the first line), then you can open a new screen like open a new activity

@harryg6843 5 ай бұрын

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?

@StevdzaSan 5 ай бұрын

Could you write the exact reproduction steps? Have you used a basic Home/Details navigation or Nested navigation with BottomBar/Tabs?

@harryg6843 5 ай бұрын

@@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)!