A lightweight library to help you navigate in compose with well typed functions.

Overview

TypedNavigation

Run detekt and build

A lightweight library to help you navigate in compose with well typed functions.

Installation:

You can add this library to your project by just adding the following code to your root build.gradle

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

Then import the library in your app build.gradle file.

implementation 'com.github.xmartlabs:TypedNavigation:0.0.2'

Usage:

You just have to define your screens and the arguments they receive:

object Router {
    val default = TypedNavigation.E("default")
    val sample = TypedNavigation.A3("sample", NavType.StringType, NavType.StringType, NavType.StringType)
}

And after that the library will provide you with the following functions:

To add your screen to the NavHost:

setContent {
    val navigationController: NavHostController = rememberNavController()
    NavHost(navController = navigationController, startDestination = Router.default.url) {
        composable(Router.default) {
            Default(navigationController = navigationController)
        }
        composable(Router.sample) { a: String?, b: String?, c: String? ->
            Sample(a, b, c)
        }
    }
}

To navigate from one screen to another:

navigationController.navigate(Router.sample.route("a", "b", "c"))

Add deep linking to your screen by setting up the correct path to the url:

// a1, a2 and a3 contains the keys for the attributes previously defined "www.example.com/$a1/$a2/$a3" } ) ">
   val sample =
    TypedNavigation.A3("sample", NavType.StringType, NavType.StringType, NavType.StringType,
        listOf { a1, a2, a3 -> // a1, a2 and a3 contains the keys for the attributes previously defined
            "www.example.com/$a1/$a2/$a3" 
        }
    )

For more examples you can check out our sample app.

About

Made with ❀️ by XMARTLABS

You might also like...
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.

πŸŽ‰ [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

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

MultiNavCompose Android library for multi-module navigation built on top of Jetpack Navigation Compose. The goal of this library is to simplify the se

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

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

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

CustomNavigationDrawer - Custom Navigation Drawer with compose
CustomNavigationDrawer - Custom Navigation Drawer with compose

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

Navigation for compose multiplatform

Navigation for compose multiplatform

An efficient TabLayout implemented in Jetpack Compose πŸš€
An efficient TabLayout implemented in Jetpack Compose πŸš€

MagicTabLayout An efficient TabLayout library implemented in Jetpack Compose πŸš€ Anatomy MagicTabLayout tabIndicatorColor (Optional, default value: blu

Comments
  • how to use it to viewmodel?

    how to use it to viewmodel?

    In normal way when I set parameter to route, i can extract it on viewmodel with savedstateHandle and use that value on viewmodel ini. How I can achieve that with your library? Because I need call getDetail API on init to prevent recalled when device rotate.

    This is part of my code in normal way
    List

    ...
    navController.navigate("detail/${coinId}")
    ...
    

    Detail

    @Composable
    fun CoinDetailScreen(
        viewModel: CoinDetailViewModel = hiltViewModel()
    ) {
      ....
    }
    

    Detail view model

    @HiltViewModel
    class CoinDetailViewModel @Inject constructor(
        private val getCoinUseCase: GetCoinUseCase,
        savedStateHandle: SavedStateHandle
    ) : ViewModel() {
           init {
                 savedStateHandle.get<String>("coinId")?.let { coinId ->
                     getCoin(coinId)
                }
          }
    }
    

    MainActivity

                CoinTheme {
                    Surface(color = MaterialTheme.colors.background) {
                        val navController = rememberNavController()
                        NavHost(
                            navController = navController,
                            startDestination = "list"
                        ) {
                            composable(
                                route = "list"
                            ) {
                                CoinListScreen(navController)
                            }
    
                            composable(
                                route = "detail/{coinId}",
                            ) {
                                CoinDetailScreen()
                            }
                        }
                    }
                }
    
    enhancement 
    opened by fjr619 1
  • Added deep links

    Added deep links

    Added deeps link to the implementation so we don't miss out on that. Also moved navArguments and url into the class and out of the constructor since there is no point in having they there and you were able to modify them.

    opened by f7deleon 0
  • Change navigate name to route

    Change navigate name to route

    Changed navigate() to route() and route to url for more clarity.

    Also added TypedNavigationInterface0 so TypedNavigation.E has a route() function and it's not added to the other implementations.

    hacktoberfest 
    opened by f7deleon 0
Releases(0.0.4)
Owner
xmartlabs
xmartlabs
An Android library that allows you to easily create applications with slide-in menus. You may use it in your Android apps provided that you cite this project and include the license in your app. Thanks!

SlidingMenu (Play Store Demo) SlidingMenu is an Open Source Android library that allows developers to easily create applications with sliding menus li

Jeremy Feinstein 11.1k Dec 27, 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

Artur Artikov 290 Dec 9, 2022
This library will help to show the polyline in dual color similar as Uber.

Dual-color-Polyline-Animation This library will help to show the polyline in dual color similar as Uber with animation in the demo. Demo Steps: Pass t

Pritam Dasgupta 75 Nov 23, 2022
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

Alperen Γ‡evlik 3 Jul 27, 2022
Bottom-App-Bar-with-Bottom-Navigation-in-Jetpack-compose-Android - Bottom App Bar with Bottom Navigation in Jetpack compose

Bottom-App-Bar-with-Bottom-Navigation-in-Jetpack-compose-Android This is simple

Shruti Patel 1 Jul 11, 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.

Adriel CafΓ© 831 Dec 26, 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).

Kaustubh Patange 88 Dec 11, 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

Vitali Olshevski 290 Dec 29, 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.

Xinto 5 Dec 27, 2022
React Native lets you customize the navigation bar for Android.

react-native-system-navigation-bar React Native lets you customize the navigation bar for Android. Hide Lean Back Immersive Sticky Immersive Low Profi

Kadir AydΔ±nlΔ± 120 Jan 3, 2023