Jetpack Compose navigation simplified with Voyager for Android & Kotlin Multiplatform

Rik van Velzen
4 min readMay 10, 2024

How to implement a bottom bar with nested navigation graphs by example..

Implementing navigation in a bug-free, clean and easy to comprehend way can be a bit of a cumbersome or even daunting process if you have not fully delved into the matter before.
Recently I was faced with refactoring an app’s UI from Android’s old XML standard to fully using Jetpack Compose. With that consequently also came the desire to refactor the navigation from a Fragment-based Jetpack Navigation to Navigation Compose.
Next to that, since the app is being develop for Kotlin Multiplatform, the newly choosen navigation system should also accomodate for this requirement of working on non Android platforms.

There are a couple of libraries out there that provide a solution for the KMP environment. Most notably I found Decompose and Voyager; Decompose being more than just a library one can use for handling Compose Navigation.

Voyager: compose navigation supporting Kotlin Multiplatform

Voyager stood out for me in it’s simplicity and minimization of boiler plate code that one needs to write to get a project up and running, even when consider slightly complexer (and very common!) use cases like having a bottom bar to navigate between screen and having nested navigation graphs for each…

--

--