Android multi-module navigation built on top of Jetpack Navigation Compose

Last update: Apr 16, 2022

MultiNavCompose logo

GitHub license ktlint Android API JitPack

Android library for multi-module navigation built on top of Jetpack Navigation Compose.

The goal of this library is to simplify the setup for multi-module navigation with Jetpack Navigation Compose.

Setup

Add jitpack.io url as maven repository:

repositories {  
	...  
	maven { url 'https://jitpack.io' }  
}    

Add dependency into build.gradle:

dependencies {  
    implementation 'com.github.jeziellago:multinavcompose:TAG'  
}  

1. Create a NavComposableModule

Make your composables internal and expose only a NavComposableModule for each module.

// module :posts  
val postsNavModule = NavComposableModule { graph, navController ->  
    graph.composable(POSTS_ROUTE) {  
        PostsScreen(onClick = { postId ->  
            navController.navigate("$POST_DETAIL_ROUTE/$postId")  
        })  
    }  
}  

You also can have nested graphs:

// module :posts  
val postsNavModule = NavComposableModule { graph, navController ->  
	graph.navigation(startDestination = POSTS_ROUTE, route = POSTS) { 
	    composable(POSTS_ROUTE) {  
	        PostsScreen(onClick = { postId ->  
	            navController.navigate("$POST_DETAIL_ROUTE/$postId")  
	        })  
	     }
	     ...
    }
}  

2. Register the NavComposeModule`s

Single NavHost

Call multiNavModules and put all the NavComposeModule's.

For single activity applications (and only a NavHost) you should register the NavComposeModule in onCreate on Application.

class MyApplication : Application() {  
  
    override fun onCreate() {  
        super.onCreate()  
        // Register all NavComposeModules  
        multiNavModules(homeNavModule, postsNavModule, postDetailNavModule)  
    }  
}  

Multiple NavHost's

If you have multiple NavHost's, a key is required on registering each of them:

// feed nav graph
multiNavModules(feedNavModule) { FEED_GRAPH }

// posts nav graph
multiNavModules(postsNavModule, postDetailNavModule) { POST_GRAPH }

3. Setup on NavHost

The loadMultiNavComposables loads the composables into NavHost.

Single NavHost

NavHost(navController = navController, startDestination = HOME) {  
  loadMultiNavComposables(navController)  
}

Multiple NavHost

If you have multiple NavHost's, a key is required too (see POSTS_GRAPH).

NavHost(navController = navController, startDestination = POSTS_ROUTE) {  
  loadMultiNavComposables(navController, POSTS_GRAPH)  
}

License

Copyright (c) 2021 Jeziel Lago  
  
Permission is hereby granted, free of charge, to any person obtaining  
a copy of this software and associated documentation files (the  
"Software"), to deal in the Software without restriction, including  
without limitation the rights to use, copy, modify, merge, publish,  
distribute, sublicense, and/or sell copies of the Software, and to  
permit persons to whom the Software is furnished to do so, subject to  
the following conditions:  
  
The above copyright notice and this permission notice shall be  
included in all copies or substantial portions of the Software.  
  
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,  
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF  
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND  
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE  
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION  
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION  
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.  

GitHub

https://github.com/jeziellago/multinavcompose
You might also like...

DSC Moi University session on using Navigation components to simplify creating navigation flow in our apps to use best practices recommended by the Google Android Team

Navigation Components Navigate between destination using safe args How to use the navigation graph and editor How send data between destinations Demo

Feb 3, 2022

[ACTIVE] Simple Stack, a backstack library / navigation framework for simpler navigation and state management (for fragments, views, or whatevers).

[ACTIVE] Simple Stack, a backstack library / navigation framework for simpler navigation and state management (for fragments, views, or whatevers).

Simple Stack Why do I want this? To make navigation to another screen as simple as backstack.goTo(SomeScreen()), and going back as simple as backstack

Aug 12, 2022

Navigation Component: THE BEST WAY to create navigation flows for your app

Navigation Component: THE BEST WAY to create navigation flows for your app

LIVE #017 - Navigation Component: A MELHOR FORMA de criar fluxos de navegação para o seu app! Código fonte do projeto criado na live #017, ensinando c

Jun 15, 2022

Navigation Drawer Bottom Navigation View

Navigation Drawer Bottom Navigation View

LIVE #019 - Toolbar, Navigation Drawer e BottomNavigationView com Navigation Com

Jun 15, 2022

Animated Tab Bar is an awesome navigation extension that you can use to add cool, animated and fully customizable tab navigation in your apps

Animated Tab Bar is an awesome navigation extension that you can use to add cool, animated and fully customizable tab navigation in your apps

Animated Tab Bar is an awesome navigation extension that you can use to add cool, animated and fully customizable tab navigation in your apps. The extension provides handy methods and properties to change the behaviour as well as the appearance of the navigation bar.

Jul 27, 2022

CustomNavigationDrawer - Custom Navigation Drawer with compose

CustomNavigationDrawer - Custom Navigation Drawer with compose

An easy sample to explore navigation component and navigation drawer from Jetpac

Jan 4, 2022

Navigation for compose multiplatform

Navigation for compose multiplatform

Apr 11, 2022

Jetpack Compose BottomDrawerScaffold (Material Bottom Drawer)

Jetpack Compose BottomDrawerScaffold (Material Bottom Drawer)

BottomDrawerScaffold Current Compose Version: 1.0.2 Compose BottomDrawerScaffold which implements the Material Bottom Drawer https://material.io/compo

Aug 9, 2022

🎉 [Android Library] A light-weight library to easily make beautiful Navigation Bar with ton of 🎨 customization option.

🎉 [Android Library] A light-weight library to easily make beautiful Navigation Bar with ton of 🎨 customization option.

Bubble Navigation 🎉 A light-weight library to easily make beautiful Navigation Bars with a ton of 🎨 customization options. Demos FloatingTopBarActiv

Aug 10, 2022
🛸Voyager is a pragmatic navigation library built for, and seamlessly integrated with, Jetpack Compose.
🛸Voyager is a pragmatic navigation library built for, and seamlessly integrated with, Jetpack Compose.

Voyager is a pragmatic navigation library built for, and seamlessly integrated with, Jetpack Compose.

Aug 9, 2022
A multi back stack android navigation
A multi back stack android navigation

Labyrinth A multi back stack android navigation MIT License - Copyright (c) 2020 Abanoub Milad Nassief Hanna [email protected] @Linkedin @Github Scr

Dec 28, 2021
Annotation processor that provides better navigation on android multi-modules projects 🛳.
Annotation processor that provides better navigation on android multi-modules projects 🛳.

FlowNav FlowNav is a mobile library for Android that helps and provider a better way to make multi-modules navigation. The main purpose of this librar

Jun 24, 2022
New style for app design simple bottom navigation with side navigation drawer UI made in Jetpack Compose.😉😎
New style for app design simple bottom navigation with side navigation drawer UI made in Jetpack Compose.😉😎

BottomNavWithSideDrawer New style for app design simple bottom navigtaion with side navigation drawer UI made in Jetpack Compose. ?? ?? (Navigation Co

Jul 6, 2022
A small navigation library for Android to ease the use of fragment transactions & handling backstack (also available for Jetpack Compose).
A small navigation library for Android to ease the use of fragment transactions & handling backstack (also available for Jetpack Compose).

A small navigation library for Android to ease the use of fragment transactions & handling backstack (also available for Jetpack Compose).

Jul 23, 2022
Implementing bottom navigation in jetpack compose

Compose-Bottom-Navigation Implementing bottom navigation in jetpack compose Add the Navigation dependency Open the app's build file, found at app/buil

Dec 26, 2021
A library that you can use for bottom navigation bar. Written with Jetpack Compose
A library that you can use for bottom navigation bar. Written with Jetpack Compose

FancyBottomNavigationBar A library that you can use for bottom navigation bar. W

Jul 27, 2022
A small and simple, yet fully fledged and customizable navigation library for Jetpack Compose
A small and simple, yet fully fledged and customizable navigation library for Jetpack Compose

A small and simple, yet fully fledged and customizable navigation library for Jetpack Compose

Aug 12, 2022
A small navigation library for Jetpack Compose with state saving, backstack and animations support.

A small navigation library for Jetpack Compose with state saving, backstack and animations support.

Jul 24, 2022
Alligator is a modern Android navigation library that will help to organize your navigation code in clean and testable way.

Alligator Alligator is a modern Android navigation library that will help to organize your navigation code in clean and testable way. Features Any app

Jul 7, 2022