In this blog post there is going to see a lot of nav this and navigation that, it can get confusing. This section will act as as sort of appendix for the post.
Navigation Graph :
is a resource file that contains all of our destinations and actions. This graph represents all of our app's possible navigation paths.
NavHost :
this is a very important interface and concept. The NavHost acts as an empty container where destinations are swapped in and out as the user navigates through the app. All navigation is done inside of a NavHost.
NavHostFragment :
this is the default implementation of NavHost and is what is responsible for swapping between destinations. We will add this manually inside of a XML file.
NavController :
the actual navigation is done through a NavController, inside of a NavHostFragment. Each NavHostFragment has its own NavController.
Destinations :
navigation in our app occurs between destinations, meaning that anywhere out app can navigate is called a destination. Destinations are represented via fragments.
Actions :
logical connections between our destinations that represent the paths our user can take. We use these actions to tell our app the proper navigation route.
The Navigation Component is a collection of libraries and tools that we have available to us. So anytime someone is talking about the Navigation Component they are not referencing a singular object or class but an entire collection.
Navigation Component is designed for apps that have one main activity with multiple fragments. The main activity is associated with a navigation graph and contains a NavHostFragment that is responsible for swapping destination as needed. In an app with multiple activity destinations, each activity should have its own navigation graph.
Transactions are removed. If you are navigating between fragment based screens under the same activity, then there is no longer a need for the FragmentManager. Fragment transactions are replaced by providing our navigation graph with actions, destinations and the navigating via the NavController.
With all that being said we can now finally jump into some code. Now when creating a Navigation Component there are 5 basic steps that we should follow:
1)
Create a navigation graph
2)
Add a NavHost to the main Activity
3)
Add destinations to the navigation graph
4)
Connect the destinations
5)
Navigate with the NavController
Now in order to create a navigation graph the first thing that we need to do is to create a resource folder. Right click on the res directory and select
new -> Android Resource File
You will then be presented with a new window. Inside of that new window, fill out the file name to what every you want, for us we went with
nav_graph
. You must ensure that the resource type is set to navigation and then click ok. If you look inside of the
res
folder you will notice that there is a new package called
navigation
and inside of that package is a new file called
nav_graph.xml
. This is the resource file that will get inflated to represent our navigation graph.
A quick reminder that NavHost acts as the container that will host all of the navigation interactions. So inside of our
main_activity.xml
we need to add a FragmentContainerView. If you are unfamiliar with FragmentContainerView, it is simply a view that is specialized to hold fragments. So we go inside the
main_activity.xml
file and put this:
First lets talk about the android:name because this alone is a very important part of the FragmentContainerView. When we set the android:name we are telling the FragmentContainerView to do a one time transaction and this transaction consists of 3 things:
1) : creates a new instance of the fragment 2) : calls Fragment.onInflate() to inflate the Fragment 3) : Executes a fragment transaction to add the Fragment to the appropriate Fragment Manager
So when we set the name attribute to "androidx.navigation.fragment.NavHostFragment" it will go through the 3 statements that are stated above.
Now we need to navigate to the nav_graph.xml file and make sure you have selected the design tab. You will be presented with the navigation editor, this tool allows us to visually edit our navigation graph.
To add a new destination, simply click the plus icon and we will be presented with a list of all the possible destinations. Which is really just all of our fragments. You can also choose to create your own destination but for us we simply chose an existing fragment.
Once we added our destinations we need to determine which of our destination should be the home destination. Click on the desired fragment and then click the home icon.
When we connect two destinations we do so through actions. We can easily create actions by using the Graph Editor that is provided to us via the Navigation Editor. The Graph Editor is the middle section of the Navigation Editor. So click on the home destination and drag an arrow to another desired destination.
public class MainFragment extends Fragment implements View.OnClickListener{
private NavController navController;
public MainFragment(){
super(R.layout.main_fragment);
@Override
public void onViewCreated(View view, Bundle savedInstanceState){
super.onViewCreated(view,savedInstanceState);
this.navController = Navigation.findNavController(view);
view.findViewById(R.id.button1).setOnClickListener(this);
view.findViewById(R.id.button2).setOnClickListener(this);
@Override
public void onClick(View view) {
this.navController.navigate(R.id.action_mainFragment_to_fragmentOne);;
Just a quick refresher, a NavController is responsible for managing app navigation within a NavHost. In order to use a NavController we first have to have one and we are doing with Navigation.findNavController(view). The Navigation class provides us with utility methods for finding the NavController. findNavController(view) will locate the NavController associated with the provided view.
Now that we have the NavController we can navigate to the desired fragment with navigate(). This method takes a resource id that represents an action inside of our navigation map. With that we are now done.
Built on Forem — the open source software that powers DEV and other inclusive communities.
