Lesson 6:
App navigation
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin v1.0 1
About this lesson
Lesson 6: App navigation
● Multiple activities and intents
● App bar, navigation drawer, and menus
● Fragments
● Navigation in an app
● More custom navigation behavior
● Navigation UI
● Summary
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 2
Multiple activities and
intents
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 3
Multiple screens in an app
Sometimes app functionality may be separated into multiple screens.
Examples:
● View details of a single item (for example, product in a shopping app)
● Create a new item (for example, new email)
● Show settings for an app
● Access services in other apps (for example, photo gallery or browse
documents)
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 4
Intent
Requests an action from another app component, such as another Activity
● An Intent usually has two primary pieces of information:
○ Action to be performed (for example, ACTION_VIEW,
ACTION_EDIT, ACTION_MAIN)
○ Data to operate on (for example, a person’s record in the contacts
database)
● Commonly used to specify a request to transition to another Activity
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 5
Explicit intent
● Fulfills a request using a specific component
● Navigates internally to an Activity in your app
● Navigates to a specific third-party app or another app you've
written
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 6
Explicit intent examples
Navigate between activities in your app:
fun viewNoteDetail() {
val intent = Intent(this, NoteDetailActivity::class.java)
intent.putExtra(NOTE_ID, note.id)
startActivity(intent)
}
Navigate to a specific external app:
fun openExternalApp() {
val intent = Intent("com.example.workapp.FILE_OPEN")
if (intent.resolveActivity(packageManager) != null) {
startActivity(intent)
}
}
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 7
Implicit intent
● Provides generic action the app can perform
● Resolved using mapping of the data type and action to known
components
● Allows any app that matches the criteria to handle the request
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 8
Implicit intent example
fun sendEmail() {
val intent = Intent(Intent.ACTION_SEND)
intent.type = "text/plain"
intent.putExtra(Intent.EXTRA_EMAIL, emailAddresses)
intent.putExtra(Intent.EXTRA_TEXT, "How are you?")
if (intent.resolveActivity(packageManager) != null) {
startActivity(intent)
}
}
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 9
App bar, navigation drawer,
and menus
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 10
App bar
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 11
Navigation drawer
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 12
Menu
Define menu items in XML menu resource (located in res/menu folder)
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/action_settings"
android:orderInCategory="100"
android:title="@string/action_settings"
app:showAsAction="never" />
</menu>
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 13
More menu options
<menu>
<group android:checkableBehavior="single">
<item
android:id="@+id/nav_home"
android:icon="@drawable/ic_menu_camera"
android:title="@string/menu_home" />
<item
android:id="@+id/nav_gallery"
android:icon="@drawable/ic_menu_gallery"
android:title="@string/menu_gallery" />
<item
android:id="@+id/nav_slideshow"
android:icon="@drawable/ic_menu_slideshow"
android:title="@string/menu_slideshow" />
</group>
</menu>
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 14
Options menu example
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="@+id/action_intent"
android:title="@string/action_intent" />
<item
android:id="@+id/action_settings"
android:orderInCategory="100"
android:title="@string/action_settings"
app:showAsAction="never" />
</menu>
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 15
Inflate options menu
override fun onCreateOptionsMenu(menu: Menu): Boolean {
menuInflater.inflate(R.menu.main, menu)
return true
}
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 16
Handle menu options selected
override fun onOptionsItemSelected(item: MenuItem): Boolean {
when (item.itemId) {
R.id.action_intent -> {
val intent = Intent(Intent.ACTION_WEB_SEARCH)
intent.putExtra(SearchManager.QUERY, "pizza")
if (intent.resolveActivity(packageManager) != null) {
startActivity(intent)
}
}
else -> Toast.makeText(this, item.title, Toast.LENGTH_LONG).show()
...
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 17
Fragments
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 18
Fragments for tablet layouts
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 19
Fragment
● Represents a behavior or portion of the UI in an activity
("microactivity")
● Must be hosted in an activity
● Lifecycle tied to host activity's lifecycle
● Can be added or removed at runtime
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 20
Note about fragments
Use the AndroidX version of the Fragment class.
(androidx.fragment.app.Fragment).
Don't use the platform version of the Fragment class
(android.app.Fragment), which was deprecated.
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 21
Navigation within an app
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 22
Navigation component
● Collection of libraries and tooling, including an integrated editor, for
creating navigation paths through an app
● Assumes one Activity per graph with many Fragment
destinations
● Consists of three major parts:
○ Navigation graph
○ Navigation Host (NavHost)
○ Navigation Controller (NavController)
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 23
Add dependencies
In build.gradle, under dependencies:
implementation "androidx.navigation:navigation-fragment-ktx:$nav_version"
implementation "androidx.navigation:navigation-ui-ktx:$nav_version"
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 24
Navigation host (NavHost)
<fragment
android:id="@+id/nav_host"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:navGraph="@navigation/nav_graph_name"/>
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 25
Navigation graph
New resource type located in res/navigation
directory
● XML file containing all of your navigation
destinations and actions
● Lists all the (Fragment/Activity) destinations that
can be navigated to
● Lists the associated actions to traverse between
them
● Optionally lists animations for entering or exiting
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 26
Navigation Editor in Android Studio
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 27
Creating a Fragment
● Extend Fragment class
● Override onCreateView()
● Inflate a layout for the Fragment that you have defined in XML
class DetailFragment : Fragment() {
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?): View? {
return inflater.inflate(R.layout.detail_fragment, container, false)
}
}
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 28
Specifying Fragment destinations
● Fragment destinations are denoted by the action tag in the
navigation graph.
● Actions can be defined in XML directly or in the Navigation Editor by
dragging from source to destination.
● Autogenerated action IDs take the form of
action_<sourceFragment>_to_<destinationFragment>.
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 29
Example fragment destination
<fragment
android:id="@+id/welcomeFragment"
android:name="com.example.android.navigation.WelcomeFragment"
android:label="fragment_welcome"
tools:layout="@layout/fragment_welcome" >
<action
android:id="@+id/action_welcomeFragment_to_detailFragment"
app:destination="@id/detailFragment" />
</fragment>
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 30
Navigation Controller (NavController)
NavController manages UI navigation in a navigation host.
● Specifying a destination path only names the action, but it
doesn’t execute it.
● To follow a path, use NavController.
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 31
Example NavController
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
...
val navController = findNavController(R.id.myNavHostFragment)
}
fun navigateToDetail() {
navController.navigate(R.id.action_welcomeFragment_to_detailFragment)
}
}
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 32
More custom navigation
behavior
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 33
Passing data between destinations
Using Safe Args:
● Ensures arguments have a valid type
● Lets you provide default values
● Generates a <SourceDestination>Directions class with methods for
every action in that destination
● Generates a class to set arguments for every named action
● Generates a <TargetDestination>Args class providing access to the
destination's arguments
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 34
Setting up Safe Args
In the project build.gradle file:
buildscript {
repositories {
google()
}
dependencies {
classpath "androidx.navigation:navigation-safe-args-gradle-plugin:$nav_version"
}
}
In the app's or module's build.gradle file:
apply plugin: "androidx.navigation.safeargs.kotlin"
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 35
Sending data to a Fragment
1. Create arguments the destination fragment will expect.
2. Create action to link from source to destination.
3. Set the arguments in the action method on
<Source>FragmentDirections.
4. Navigate according to that action using the Navigation Controller.
5. Retrieve the arguments in the destination fragment.
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 36
Destination arguments
<fragment
android:id="@+id/multiplyFragment"
android:name="com.example.arithmetic.MultiplyFragment"
android:label="MultiplyFragment" >
<argument
android:name="number1"
app:argType="float"
android:defaultValue="1.0" />
<argument
android:name="number2"
app:argType="float"
android:defaultValue="1.0" />
</fragment>
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 37
Supported argument types
Type Type Syntax Supports Default Supports Null
app:argType=<type> Values Values
Integer "integer" Yes No
Float "float" Yes No
Long "long" Yes No
Boolean "boolean" Yes ("true" or "false") No
String "string" Yes Yes
Array above type + "[]" Yes (only "@null") Yes
(for example, "string[]" "long[]")
Enum Fully qualified name of the enum Yes No
Resource reference "reference" Yes No
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 38
Supported argument types: Custom classes
Type Type Syntax Supports Default Supports Null
app:argType=<type> Values Values
Serializable Fully qualified class name Yes (only "@null") Yes
Parcelable Fully qualified class name Yes (only "@null") Yes
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 39
Create action from source to destination
In nav_graph.xml:
<fragment
android:id="@+id/fragment_input"
android:name="com.example.arithmetic.InputFragment">
<action
android:id="@+id/action_to_multiplyFragment"
app:destination="@id/multiplyFragment" />
</fragment>
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 40
Navigating with actions
In InputFragment.kt:
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
binding.button.setOnClickListener {
val n1 = binding.number1.text.toString().toFloatOrNull() ?: 0.0
val n2 = binding.number2.text.toString().toFloatOrNull() ?: 0.0
val action = InputFragmentDirections.actionToMultiplyFragment(n1, n2)
view.findNavController().navigate(action)
}
}
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 41
Retrieving Fragment arguments
class MultiplyFragment : Fragment() {
val args: MultiplyFragmentArgs by navArgs()
lateinit var binding: FragmentMultiplyBinding
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
val number1 = args.number1
val number2 = args.number2
val result = number1 * number2
binding.output.text = "${number1} * ${number2} = ${result}"
}
}
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 42
Navigation UI
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 43
Menus revisited
override fun onOptionsItemSelected(item: MenuItem): Boolean {
val navController = findNavController(R.id.nav_host_fragment)
return item.onNavDestinationSelected(navController) ||
super.onOptionsItemSelected(item)
}
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 44
DrawerLayout for navigation drawer
<androidx.drawerlayout.widget.DrawerLayout
android:id="@+id/drawer_layout" ...>
<fragment
android:name="androidx.navigation.fragment.NavHostFragment"
android:id="@+id/nav_host_fragment" ... />
<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view"
app:menu="@menu/activity_main_drawer" ... />
</androidx.drawerlayout.widget.DrawerLayout>
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 45
Finish setting up navigation drawer
Connect DrawerLayout to navigation graph:
val appBarConfiguration = AppBarConfig(navController.graph, drawer)
Set up NavigationView for use with a NavController:
val navView = findViewById<NavigationView>(R.id.nav_view)
navView.setupWithNavController(navController)
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 46
Understanding the back stack
State 1 State 2 State 3
Activity 3
Activity 2 Activity 2 Activity 2
Activity 1 Activity 1 Activity 1
Back stack Back stack Back stack
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin
Fragments and the back stack
State 1 State 2 State 3
Fragment 2
Fragment 1 Fragment 1 Fragment 1
Activity 2 Activity 2 Activity 2
Activity 1 Activity 1 Activity 1
Back stack Back stack Back stack
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin
Summary
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 49
Summary
In Lesson 6, you learned how to:
● Use explicit and implicit intents to navigate between Activities
● Structure apps using fragments instead of putting all UI code in the
Activity
● Handle navigation with NavGraph, NavHost, and NavController
● Use Safe Args to pass data between fragment destinations
● Use NavigationUI to hook up top app bar, navigation drawer, and bottom
navigation
● Android keeps a back stack of all the destinations you’ve visited, with
each new destination being pushed onto the stack.
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 50
Learn more
● Principles of navigation
● Navigation component
● Pass data between destinations
● NavigationUI
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 51
Pathway
Practice what you’ve learned by
completing the pathway:
Lesson 6: App navigation
This work is licensed under the Apache 2 license.
Apache 2 license
Android Development with Kotlin 52
