Navigation Architecture Component | Jetpack

This presentation was given at GDG Munich Android meetup (https://www.meetup.com/GDG-Munich-Android/events/264156274/) which was focused on "Jetpack". I was lucky to get a chance to explore and use the "Navigation" component in an existing codebase to rewrite a flow.

This talk was basically an intro of core features, main building blocks, some advance use-cases, and my overall impression. Hopefully, it was motivating enough for the audience to give it a try and get a good kick-start already :)

Transcript

1. NAVIGATION ARCHITECTURE COMPONENT Wahib-Ul-Haq @wahibhaq @DevRelMunich GDG Munich Android 04.09.2019
6. Totally appreciate efforts of the team behind “Navigation” which is trying to make things easier for developers along with providing more clarity on principles
7. Announced in Google I/O 2018 Reached stable version in March 2019
8. The Navigation Architecture Component is designed for apps that have…
9. The Navigation Architecture Component is designed for apps that have… one main activity with multiple fragment destinations
10. In an app with multiple activity destinations, each additional activity hosts its own navigation graph
11. MOTIVATION
12. Designed to enforce the “Principles of Navigation”
13. Designed to enforce the “Principles of Navigation” Explicit about handling of “Up” ( navigateUp() ) and “Back” ( popBackStack() )
14. Designed to enforce the “Principles of Navigation” Explicit about handling of “Up” ( navigateUp() ) and “Back” ( popBackStack() ) Visual navigation graph for easy overview
15. Designed to enforce the “Principles of Navigation” Explicit about handling of “Up” ( navigateUp() ) and “Back” ( popBackStack() ) Visual navigation graph for easy overview Allows you to skip implementing FragmentTransactions
16. Designed to enforce the “Principles of Navigation” Explicit about handling of “Up” ( navigateUp() ) and “Back” ( popBackStack() ) Visual navigation graph for easy overview Allows you to skip implementing FragmentTransactions Type-safety for arguments when using SafeArgs
17. Designed to enforce the “Principles of Navigation” Explicit about handling of “Up” ( navigateUp() ) and “Back” ( popBackStack() ) Visual navigation graph for easy overview Allows you to skip implementing FragmentTransactions Type-safety for arguments when using SafeArgs Conditional navigation is possible
18. Designed to enforce the “Principles of Navigation” Explicit about handling of “Up” ( navigateUp() ) and “Back” ( popBackStack() ) Visual navigation graph for easy overview Allows you to skip implementing FragmentTransactions Type-safety for arguments when using SafeArgs Conditional navigation is possible Easy handling of deep links with synthetic back stack for “Up” navigation
19. Designed to enforce the “Principles of Navigation” Explicit about handling of “Up” ( navigateUp() ) and “Back” ( popBackStack() ) Visual navigation graph for easy overview Allows you to skip implementing FragmentTransactions Type-safety for arguments when using SafeArgs Conditional navigation is possible Easy handling of deep links with synthetic back stack for “Up” navigation Works with Navigation UI Patterns like NavigationView and BottomNavigationView
20. Designed to enforce the “Principles of Navigation” Explicit about handling of “Up” ( navigateUp() ) and “Back” ( popBackStack() ) Visual navigation graph for easy overview Allows you to skip implementing FragmentTransactions Type-safety for arguments when using SafeArgs Conditional navigation is possible Easy handling of deep links with synthetic back stack for “Up” navigation Works with Navigation UI Patterns like NavigationView and BottomNavigationView Testing
21. BUILDING BLOCKS
22. NavHostFragment NavHost is an empty container where destinations are swapped in and out as a user navigates through your app NavHostFragment is the default NavHost implementation and handles swapping fragment destinations
27. Graph NavGraph is a collection of destinations and actions It can be defined as xml file or created programmatically You can have multiple navigation graphs in your application and they can be nested
29. https://developer.android.com/guide/navigation/
30. https://developer.android.com/guide/navigation/
31. Destinations Individual screens are referred as destinations which could be Fragments or Activities StartDestination is the first screen in the flow or graph Activity destinations are considered terminal destinations
32. NavController NavController, an object that manages app navigation within a NavHost and is used to navigate to a destination
33. NavController NavController, an object that manages app navigation within a NavHost and is used to navigate to a destination When you call navigate(), it handles the rest
34. NavController NavController, an object that manages app navigation within a NavHost and is used to navigate to a destination When you call navigate(), it handles the rest Various static methods to retrieve NavController
36. NavController NavController, an object that manages app navigation within a NavHost and is used to navigate to a destination When you call navigate(), it handles the rest Various static methods to retrieve NavController Each NavHost has its own corresponding NavController
37. NavController NavController, an object that manages app navigation within a NavHost and is used to navigate to a destination When you call navigate(), it handles the rest Various static methods to retrieve NavController Each NavHost has its own corresponding NavController Prefer navigating via Actions over Destination Ids
38. https://developer.android.com/guide/navigation/
39. Actions Configuration for each Action includes destination, default arguments and navigation options With Safe-Args, *FragmentDirections class and *FragmentArgs class is generated Safe-Args require plugin "androidx.navigation.safeargs.kotlin" Global action enables reusable navigation and is defined at root level of graph (E.g navigating to an external activity)
45. Deep Links Deep links can be created programmatically (only explicit ones*)
47. Deep Links Deep links can be created programmatically (only explicit ones*) Add <nav-graph> reference in the Manifest under the host activity for Implicit ones (and external access)
49. Deep Links Deep links can be created programmatically (only explicit ones*) Add <nav-graph> reference in the Manifest under the host activity for Implicit ones (and external access) URIs without a scheme are assumed as http and https
50. Deep Links Deep links can be created programmatically (only explicit ones*) Add <nav-graph> reference in the Manifest under the host activity for Implicit ones (and external access) URIs without a scheme are assumed as http and https Scheme needs to be explicitly defined
52. Deep Links Deep links can be created programmatically (only explicit ones*) Add <nav-graph> reference in the Manifest under the host activity for Implicit ones (and external access) URIs without a scheme are assumed as http and https Scheme needs to be explicitly defined Possible to define multiple implicit ones for single destination
54. Deep Links Deep links can be created programmatically (only explicit ones*) Add <nav-graph> reference in the Manifest under the host activity for Implicit ones (and external access) URIs without a scheme are assumed as http and https Scheme needs to be explicitly defined Possible to define multiple implicit ones for single destination Navigate programmatically using an implicit deep link
56. Note: When navigating using URI, the back stack is not reset.
57. FUN STUFF
59. Conditional Navigation https://github.com/gogeta95/NavigationSplashScreen
61. https://developer.android.com/guide/navigation/navigation-conditional
63. Deep Links To handle the deep linking we need to add intent filter to our AndroidManifest.xml Deep links can be created programmatically Doc says that adding <nav-graph> should be enough but I still needed to add intent filters explicitly in the Manifest
64. Deep Links
65. https://medium.com/swlh/using-the-navigation-component-in-a-modular-world-e7578825962
66. Multi-Graph Navigation
67. Multi-Graph Navigation Nested graph: Sub-group of destinations which allow reusing section of app’s UI
68. Multi-Graph Navigation Nested graph: Sub-group of destinations which allow reusing section of app’s UI Navigating between graphs across modules is possible
69. Multi-Graph Navigation Nested graph: Sub-group of destinations which allow reusing section of app’s UI Navigating between graphs across modules is possible To navigate from Feature One to Feature Two graph, we can navigate using the deep link URI
70. Multi-Graph Navigation Nested graph: Sub-group of destinations which allow reusing section of app’s UI Navigating between graphs across modules is possible To navigate from Feature One to Feature Two graph, we can navigate using the deep link URI Main app graph can include the feature module's graphs using <include> tag
71. https://medium.com/swlh/using-the-navigation-component-in-a-modular-world-e7578825962
72. Multi-Graph Multi-Module Navigation (#1) Each module has its own graph with all the Fragments but without Activity Single Activity defined in app module Each module refers to a bottom nav item
74. Multi-Graph Multi-Module Navigation (#2) https://github.com/PhilippeBoisney/ArchApp
75. Multi-Graph Multi-Module Navigation (#2) Graphs are defined in a separate navigation module App module depends on navigation and includes Host Activity Each module contains Fragments and other necessary classes
76. Working with Bottom Nav and Multi-module Simpler Implementation: https://github.com/kuuuurt/rick-and-morty-app Advance Implementation: https://github.com/googlesamples/android-architecture-components/tree/master/NavigationAdva ncedSample
77. Will it work if destinations are Custom Views?
78. Will it work if destinations are Custom Views? Yes, it is possible to add new Destination Type To add a custom destination, you have to implement the Navigator interface https://developer.android.com/guide/navigation/navigation-add-new
79. https://www.raywenderlich.com/6014-the-navigation-architecture-component-tutorial-getting-started#toc-anchor-016
80. Will it work if destinations are Custom Views? Yes, it is possible to add new Destination Type To add a custom destination, you have to implement the Navigator interface You pass it to the NavigationController when initializing the navigation graph https://developer.android.com/guide/navigation/navigation-add-new
81. https://www.raywenderlich.com/6014-the-navigation-architecture-component-tutorial-getting-started#toc-anchor-016
82. CURRENT CHALLENGE
84. How to make Deep Links work with dynamic scheme
85. How to make Deep Links work with dynamic scheme
86. Learnings Be vigilant and have a plan when you are refactoring/rewriting a flow inside existing codebase
87. Learnings Be vigilant and have a plan when you are refactoring/rewriting a flow inside existing codebase Gladly, there is a migration doc
88. Learnings Be vigilant and have a plan when you are refactoring/rewriting a flow inside existing codebase Gladly, there is a migration doc Codelabs implementation might be outdated
89. Learnings Be vigilant and have a plan when you are refactoring/rewriting a flow inside existing codebase Gladly, there is a migration doc Codelabs implementation might be outdated Expect implementing transient solution if unable to use alpha or release candidate (e.g custom back navigation via OnBackPressedCallback)
90. Learnings Be vigilant and have a plan when you are refactoring/rewriting a flow inside existing codebase Gladly, there is a migration doc Codelabs implementation might be outdated Expect implementing transient solution if unable to use alpha or release candidate (e.g custom back navigation via OnBackPressedCallback) Integrating Deep link in existing implementation could be a challenge, might need nested deep links
91. Learnings Be vigilant and have a plan when you are refactoring/rewriting a flow inside existing codebase Gladly, there is a migration doc Codelabs implementation might be outdated Expect implementing transient solution if unable to use alpha or release candidate (e.g custom back navigation via OnBackPressedCallback) Integrating Deep link in existing implementation could be a challenge, might need nested deep links Dynamic Feature Navigation is yet to be included in the library (work-in-progress)
92. Learnings Be vigilant and have a plan when you are refactoring/rewriting a flow inside existing codebase Gladly, there is a migration doc Codelabs implementation might be outdated Expect implementing transient solution if unable to use alpha or release candidate (e.g custom back navigation via OnBackPressedCallback) Integrating Deep link in existing implementation could be a challenge, might need nested deep links Dynamic Feature Navigation is yet to be included in the library (work-in-progress) Synthetic back navigation might not work out of the box with deep link
94. Thanks for listening! @wahibhaq @DevRelMunich