Android's Navigation Architecture Component

Ken Baldauf

Senior Software Engineer @ Originate

What is Navigation?

  • Part of Android Jetpack
  • Announced @ I/O 2018
  • Beta in February

What is Navigation?

  • Simplify implementation of navigation
  • Scoped to a single activity
  • Handles fragment management

3 Main Components

  • NavGraph
  • NavHost
  • NavController

NavGraph

  • XML resource + navigation editor
  • Contains all navigation related info
  • Consists of  destinations & actions
  • Can have multiple (even nested) NavGraphs

NavHost

  • Container for displaying destinations
  • NavHostFragment
    • Included in navigation component
    • Default NavHost implementation
  • Each host has its own controller & graph

NavController

  • Handles all navigation within a NavHost
    • Swapping of NavGraph destinations
    • Handles click events and deep linking
    • Maintains back stack
    • Manages action bar & nav drawer
  • Replaces direct fragment interaction
    • No more FragmentManager
    • No more FragmentTransaction

NavController

  • setupActionBarWithNavController
    • ensures action bar up button & title update as destination changes
    • display of up button
  • setupWithNavController
    • ensures selected item in drawer is updated as destination changes
  • navigateUp
    • delegates up button behavior to NavController
    • action of up button

SafeArgs

  • Plugin handles argument passing between destinations
  • Source passes args via autogenerated Directions class
  • Destination retrieves then via autogenerated Args class

Action Animations

  • enterAnim
    • animation used when navigated to
  • exitAnim
    • animation used when navigated away from
  • popEnterAnim
    • animation used when navigated back to (back button)
  • popExitAnim
    • animation used when navigated away from (back button)

Deep Linking

<fragment
    android:id="@+id/homeFragment"
    android:name="org.ocandroid.navigationdemo.HomeFragment"
    android:label="@string/title_home"
    tools:layout="@layout/fragment_home" >

    <deepLink android:id="@+id/ocAndroidDeepLink"
        app:uri="www.ocandroid.org/{bundleArg}"/>

</fragment>
<activity
    android:name=".MainActivity"
    android:label="@string/app_name">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
    <nav-graph android:value="@navigation/nav_graph" />
</activity>

Edit BackStack

  • How do we implement a screen that we want to exclude from the backstack?
  • NavOptions to the rescue

Edit BackStack

val options = NavOptions.Builder()
            .setPopUpTo(R.id.splash, true // inclusive
            ).build()

findNavController().navigate(R.id.action_splash_to_home,
                null, // bundle args
                options)
<action
    android:id="@+id/action_splash_to_home"
    app:destination="@id/home"
    app:popUpTo="@id/splash"
    app:popUpToInclusive="true"/>

Nested NavGraph

<navigation xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/navGraph"
    app:startDestination="@id/homeFragment">

    <fragment
        android:id="@+id/homeFragment"
        android:name="org.ocandroid.navigationdemo.HomeFragment"
        android:label="@string/title_home"
        tools:layout="@layout/fragment_home" />

     <navigation android:id="@+id/registration_graph"
        app:startDestination="@id/signupFragment">

        <fragment android:id="@+id/signupFragment"
            android:name="org.ocandroid.navigationdemo.SignupFragment"
            android:label="@string/title_signup"
            tools:layout="@layout/fragment_signup"/>
    </navigation>
</navigation>

Questions?

Android's Navigation Architecture Component

By Kenneth Baldauf

Made with Slides.com

Android's Navigation Architecture Component

Exploration of Android's Navigation Architecture Component

  • 484

More from Kenneth Baldauf