{"id":20881442,"url":"https://github.com/js-bhavyansh/serialization_navigation","last_synced_at":"2026-05-15T21:35:27.478Z","repository":{"id":242826978,"uuid":"810361437","full_name":"js-bhavyansh/Serialization_Navigation","owner":"js-bhavyansh","description":"Implementing type safe basic and nested navigation in jetpack compose.","archived":false,"fork":false,"pushed_at":"2024-06-09T03:37:32.000Z","size":1824,"stargazers_count":1,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-12T17:15:34.794Z","etag":null,"topics":["android","android-application","android-library","jetpack-compose","jetpack-compose-navigation","jetpack-navigation","kotlin","kotlin-android","kotlin-library","serialization","type-safe-api","type-safe-navigation","type-safe-routing","typesafe"],"latest_commit_sha":null,"homepage":"","language":"Kotlin","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/js-bhavyansh.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-06-04T14:43:46.000Z","updated_at":"2024-12-14T03:52:58.000Z","dependencies_parsed_at":"2024-06-15T06:15:51.744Z","dependency_job_id":null,"html_url":"https://github.com/js-bhavyansh/Serialization_Navigation","commit_stats":null,"previous_names":["bhavyansh03-tech/type_safe_navigation","js-bhavyansh/serialization_navigation"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/js-bhavyansh/Serialization_Navigation","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/js-bhavyansh%2FSerialization_Navigation","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/js-bhavyansh%2FSerialization_Navigation/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/js-bhavyansh%2FSerialization_Navigation/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/js-bhavyansh%2FSerialization_Navigation/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/js-bhavyansh","download_url":"https://codeload.github.com/js-bhavyansh/Serialization_Navigation/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/js-bhavyansh%2FSerialization_Navigation/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":267334440,"owners_count":24070569,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-27T02:00:11.917Z","response_time":82,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","android-application","android-library","jetpack-compose","jetpack-compose-navigation","jetpack-navigation","kotlin","kotlin-android","kotlin-library","serialization","type-safe-api","type-safe-navigation","type-safe-routing","typesafe"],"created_at":"2024-11-18T07:24:54.120Z","updated_at":"2026-05-15T21:35:22.450Z","avatar_url":"https://github.com/js-bhavyansh.png","language":"Kotlin","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Jetpack Compose Type-Safe Navigation Examples\n\nWelcome to the Jetpack Compose Type-Safe Navigation Examples repository! This project showcases how to implement type-safe basic navigation, passing arguments, and nested navigation using Jetpack Compose with Kotlin.\n\n## Features\n\n- Type-Safe Basic Navigation\n- Passing Arguments\n- Nested Navigation\n\n## Setup\n\nTo get a local copy up and running, follow these simple steps:\n\n1. Clone the repository.\n\n```bash\ngit clone https://github.com/Bhavyansh03-tech/Type_Safe_Navigation.git\n```\n\n2. Open the project in Android Studio.\n3. Build the project.\n\n## Steps to Nested Implement Navigation Compose\n\nTo implement Nested Navigation Compose, follow these steps:\n\n1. Add navigation compose dependency in both libs.version.toml and gradle.build.\n\n```bash\n[versions]\nkotlin = \"2.0.0\"\ncomposeBom = \"2024.05.00\"\nnavigationCompose = \"2.8.0-beta02\"\nkotlinxSerializationJson = \"1.7.0-RC\"\n\n[libraries]\nandroidx-navigation-compose = { group = \"androidx.navigation\", name = \"navigation-compose\", version.ref = \"navigationCompose\" }\nkotlinx-serialization-json = { module = \"org.jetbrains.kotlinx:kotlinx-serialization-json\", version.ref = \"kotlinxSerializationJson\" }\n\n[plugins]\n# Compose :-\u003e\ncompose-compiler = { id = \"org.jetbrains.kotlin.plugin.compose\", version.ref = \"kotlin\" }\n\n# Serialization :-\u003e\nkotlin-serialization = { id = \"org.jetbrains.kotlin.plugin.serialization\", version.ref = \"kotlin\" }\n```\n\n\n2. Now, create a kotlin file to add screen names and pass arguments.\n\n```Kotlin\nimport kotlinx.serialization.Serializable\n\n@Serializable object AUTH\n@Serializable object ROOT\n@Serializable object Home\n@Serializable object Login\n@Serializable object Signup\n\n// Passing arguments :\n@Serializable\ndata class Detail(\n    val name: String,\n    val age: Int\n)\n```\n\n\n3. Now, create a Kotlin file and set up the `NavGraph` in that file.\n\n```Kotlin\n@Composable\nfun SetupNavGraph(\n    navController: NavHostController\n) {\n    NavHost(\n        navController = navController,\n        startDestination = AUTH\n    ) {\n        homeNavGraph(navController = navController)\n        authNavGraph(navController = navController)\n    }\n}\n```\n\n\n4. Create a new Kotlin file and define a function that extends `NavGraphBuilder` with the name of your navigation graph. For example: `NavGraphBuilder.nameOfNavGraph()`.\n\n```Kotlin\nimport androidx.navigation.NavGraphBuilder\nimport androidx.navigation.NavHostController\nimport androidx.navigation.compose.composable\nimport androidx.navigation.navigation\nimport com.example.typesafenavigation.screens.LoginScreen\nimport com.example.typesafenavigation.screens.SignupScreen\n\nfun NavGraphBuilder.authNavGraph(\n    navController: NavHostController\n){\n    navigation\u003cAUTH\u003e(\n        startDestination = Login\n    ){\n        composable\u003cLogin\u003e{\n            LoginScreen(navController = navController)\n        }\n        composable\u003cSignup\u003e{\n            SignupScreen(navController = navController)\n        }\n    }\n}\n```\n\n\n5. Don't forget to initialize `navController` in the `MainActivity`.\n\n```Kotlin\nval navController = rememberNavController()\nSetupNavGraph(navController = navController)\n```\n\n\n6. Now Add Navigation in screens. For example:\n\n```Kotlin\n@Composable\nfun LoginScreen(\n    navController: NavHostController\n) {\n\n    Box(\n        modifier = Modifier.fillMaxSize(),\n        contentAlignment = Alignment.Center\n    ){\n        Column(\n            horizontalAlignment = Alignment.CenterHorizontally,\n        ) {\n\n            Text(\n                text = \"Login Screen\",\n                fontSize = MaterialTheme.typography.headlineLarge.fontSize,\n                modifier = Modifier.align(Alignment.CenterHorizontally)\n            )\n\n            Spacer(modifier = Modifier.height(35.dp))\n\n            Button(\n                onClick = {\n                    navController.navigate(Signup)\n                }\n            ) {\n                Text(\n                    fontSize = MaterialTheme.typography.bodySmall.fontSize,\n                    text = \"SignUp\"\n                )\n            }\n\n            OutlinedButton(\n                onClick = {\n                    navController.popBackStack()\n                    navController.navigate(ROOT)\n                }\n            ) {\n                Text(\n                    fontSize = MaterialTheme.typography.bodySmall.fontSize,\n                    text = \"Go To Home Screen\"\n                )\n            }\n        }\n    }\n\n}\n```\n\n\n7. To pop a screen from the back stack, you can use:\n\n```Kotlin\n// Just OnBackPressed() function :-\u003e\nnavController.popBackStack()\n\n// If you want to pass any data to the previous screen :-\u003e\nnavController.navigate(Home) {\n    popUpTo(Home)  {\n        inclusive = true\n    }\n}\n```\n\n\n8. Passing arguments :\n\n```Kotlin\n// Create a data class in screen name file.\n// Passing arguments in navgraph in composable.\ncomposable\u003cDetail\u003e{\n    val args = it.toRoute\u003cDetail\u003e()\n    DetailScreen(navController = navController, args.age, args.name)\n}\n\n// Passing arguments in screens.\nnavController.navigate(\n    Detail(\n    name = \"Android\",\n    age = 13\n  )\n)\n\n// Getting value in screen.\n@Composable\nfun DetailScreen(\n    navController: NavHostController,\n    age: Int,\n    name: String\n) {\n// Arguments :-\u003e\nText(\n    fontSize = MaterialTheme.typography.labelSmall.fontSize,\n    text = \"Name : $name\"\n)\nText(\n  fontSize = MaterialTheme.typography.labelSmall.fontSize,\n  text = \"Age : $age\"\n)\n}\n```\n\n\n\n## Contributing\n\nContributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.\n\n1.\u003e Fork the Project.\\\n2.\u003e Create your Feature Branch `git checkout -b feature/AmazingFeature`.\\\n3.\u003e Commit your Changes `git commit -m 'Add some AmazingFeature'`.\\\n4.\u003e Push to the Branch `git push origin feature/AmazingFeature`.\\\n5.\u003e Open a Pull Request\n\n## Acknowledgements\n\n- Inspiration from various Android development tutorials and documentation.\n## Contact\n\nFor questions or feedback, please contact [@Bhavyansh03-tech](https://github.com/Bhavyansh03-tech).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjs-bhavyansh%2Fserialization_navigation","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjs-bhavyansh%2Fserialization_navigation","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjs-bhavyansh%2Fserialization_navigation/lists"}