Android Jetpack — Navigation Library (Part1 — Destinations)
Principles of Navigation
The Navigation Architecture Components define a set of principles which helps you to build an in-app-navigation with a consistent and predictable user experience.
- The app should have a fixed starting destination
- A stack is used to represent the navigation state of an app
- The Up button never exits your app
- Up and Back are equivalent within your app’s task
- Deep linking to a destination or navigating to the same destination should yield the same stack
Implement Navigation
The Navigation Architecture Component is designed to have a single activity with multiple Fragments. The Activity hosts a Navigation Graph. If your app has multiple Acitivties each Activity hosts its own Navigation Graph.
Gradle Dependency
Add the Google repository to your projects build.gradle
allprojects {
repositories {
google()
jcenter()
}
}Add the following dependencies to your app or module build.gradle file
dependencies {
implementation 'android.arch.navigation:navigation-fragment-ktx:1.0.0-alpha01'
implementation 'android.arch.navigation:navigation-ui-ktx:1.0.0-alpha01'
}Navigation Graph XML
With Android Studio 3.2 we can now add a Navigation Resource File. Right click on the res directory and choose New -> Android resource file. Choose a title for the file and select Navigation from the Resource type dropdown.
Now we have a new file with a new root element type <navigation/>:
<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android">
</navigation>Navigation Host Fragment
In our MainActivity layout we have to add a fragment as NavHost and define where the NavHostFragment finds the navigation graph.
?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<fragment
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/my_nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
app:navGraph="@navigation/nav_graph"
app:defaultNavHost="true"
/>
</android.support.constraint.ConstraintLayout>Defining Destinations
Back in our Navigation Graph we can add new destinations. We can switch between Design and Text. If we choose Design we can see a three columns layout.
- On the left side we see the defined destinations
- In the middle is the Navigation Graph
- On the right side is the Attributes editor.
We can now add existing Fragments/Activities to our Navigation Graph(Icon on the top left) or add a new blank destination.
Perform Navigation
To perform a navigation we have to define an action (right side of the Design View). We will use a simple navigation without transitions and params(In the next Part we will create more complex transactions).
Therefor we have to select our source fragment, afterwards click on the + next to the Actions and choose Add Action. Now we will see an Add Action Wizard. We have to select a destination(the id will be generated for us) and click Add.
We can now navigate with the NavigationController.navigate(id: Int) method. To retrieve the NavigationController we have to call findNavController() in our Source Fragment. The findNavController method is an extension function in Kotlin.
detailButton.setOnClickListener { view ->
view.findNavController().navigate(R.id.action_list_to_detail)
}Thats it!