Load NavigationView in Fragment

How to use NavigationView to navigate in Fragment?

  1. Add NavigationView in Fragment

  2. In order for your app to correctly call the MapView's lifecycle methods, you must override the following lifecycle methods in the Fragment that contains the NavigationView and call the respective NavigationView method. The following lifecycle methods must be overridden and include the matching NavigationView method.

For all code examples, refer to Navigation Code Examples

1@Override
2public void onStart() {
3   super.onStart();
4   navigationView.onStart();
5}
6
7@Override
8public void onResume() {
9   super.onResume();
10   navigationView.onResume();
11}
12
13@Override
14public void onSaveInstanceState(@NonNull Bundle outState) {
15   navigationView.onSaveInstanceState(outState);
16   super.onSaveInstanceState(outState);
17}
18
19@Override
20public void onViewStateRestored(@Nullable Bundle savedInstanceState) {
21   super.onViewStateRestored(savedInstanceState);
22   if (savedInstanceState != null) {
23       navigationView.onRestoreInstanceState(savedInstanceState);
24   }
25}
26
27@Override
28public void onPause() {
29   super.onPause();
30   navigationView.onPause();
31}
32
33@Override
34public void onStop() {
35   super.onStop();
36   navigationView.onStop();
37}
38
39@Override
40public void onLowMemory() {
41   super.onLowMemory();
42   navigationView.onLowMemory();
43}
44
45@Override
46public void onDestroyView() {
47   super.onDestroyView();
48   navigationView.onDestroy();
49}

activity_fragment_navigation.xml view source

1<?xml version="1.0" encoding="utf-8"?>
2<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
3   xmlns:app="http://schemas.android.com/apk/res-auto"
4   android:layout_width="match_parent"
5   android:layout_height="match_parent">
6
7   <FrameLayout
8       android:id="@+id/navigation_fragment_frame"
9       android:layout_width="match_parent"
10       android:layout_height="match_parent"
11       android:layout_marginBottom="16dp"
12       android:layout_marginEnd="16dp"
13       android:layout_marginStart="16dp"
14       android:layout_marginTop="16dp"
15       app:layout_constraintBottom_toBottomOf="parent"
16       app:layout_constraintEnd_toEndOf="parent"
17       app:layout_constraintStart_toStartOf="parent"
18       app:layout_constraintTop_toTopOf="parent" />
19
20</androidx.constraintlayout.widget.ConstraintLayout>

navigation_view_fragment_layout.xml view source

1<?xml version="1.0" encoding="utf-8"?>
2<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
3   xmlns:app="http://schemas.android.com/apk/res-auto"
4   android:layout_width="match_parent"
5   android:layout_height="match_parent">
6
7   <ai.nextbillion.navigation.ui.NavigationView
8       android:id="@+id/navigation_view_fragment"
9       android:layout_width="0dp"
10       android:layout_height="0dp"
11       app:layout_constraintBottom_toBottomOf="parent"
12       app:layout_constraintEnd_toEndOf="parent"
13       app:layout_constraintStart_toStartOf="parent"
14       app:layout_constraintTop_toTopOf="parent" />
15
16</androidx.constraintlayout.widget.ConstraintLayout>

FragmentNavigationActivity view source

1public class FragmentNavigationActivity extends AppCompatActivity {
2
3   @Override
4   protected void onCreate(Bundle savedInstanceState) {
5       super.onCreate(savedInstanceState);
6       setContentView(R.layout.activity_fragment_navigation);
7
8       initializeNavigationViewFragment(savedInstanceState);
9   }
10
11   private void initializeNavigationViewFragment(@Nullable Bundle savedInstanceState) {
12       FragmentManager fragmentManager = getSupportFragmentManager();
13       if (savedInstanceState == null) {
14           FragmentTransaction transaction = fragmentManager.beginTransaction();
15           transaction.disallowAddToBackStack();
16           transaction.add(R.id.navigation_fragment_frame, new NavigationFragment()).commit();
17       }
18   }
19}

NavigationFragment view source

1public class NavigationFragment extends Fragment implements OnNavigationReadyCallback, NavigationListener {
2
3   private static final double ORIGIN_LONGITUDE = -77.04012393951416;
4   private static final double ORIGIN_LATITUDE = 38.9111117447887;
5   private static final double DESTINATION_LONGITUDE = -77.03847169876099;
6   private static final double DESTINATION_LATITUDE = 38.91113678979344;
7
8   private NavigationView navigationView;
9   private DirectionsRoute directionsRoute;
10
11   @Nullable
12   @Override
13   public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container,
14                            @Nullable Bundle savedInstanceState) {
15       return inflater.inflate(R.layout.navigation_view_fragment_layout, container, false);
16   }
17
18   @Override
19   public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
20       super.onViewCreated(view, savedInstanceState);
21       navigationView = view.findViewById(R.id.navigation_view_fragment);
22       navigationView.onCreate(savedInstanceState);
23       navigationView.initialize(this);
24   }
25
26   @Override
27   public void onStart() {
28       super.onStart();
29       navigationView.onStart();
30   }
31
32   @Override
33   public void onResume() {
34       super.onResume();
35       navigationView.onResume();
36   }
37
38   @Override
39   public void onSaveInstanceState(@NonNull Bundle outState) {
40       navigationView.onSaveInstanceState(outState);
41       super.onSaveInstanceState(outState);
42   }
43
44   @Override
45   public void onViewStateRestored(@Nullable Bundle savedInstanceState) {
46       super.onViewStateRestored(savedInstanceState);
47       if (savedInstanceState != null) {
48           navigationView.onRestoreInstanceState(savedInstanceState);
49       }
50   }
51
52   @Override
53   public void onPause() {
54       super.onPause();
55       navigationView.onPause();
56   }
57
58   @Override
59   public void onStop() {
60       super.onStop();
61       navigationView.onStop();
62   }
63
64   @Override
65   public void onLowMemory() {
66       super.onLowMemory();
67       navigationView.onLowMemory();
68   }
69
70   @Override
71   public void onDestroyView() {
72       super.onDestroyView();
73       navigationView.onDestroy();
74   }
75
76   @Override
77   public void onNavigationReady(boolean isRunning) {
78       Point origin = Point.fromLngLat(ORIGIN_LONGITUDE, ORIGIN_LATITUDE);
79       Point destination = Point.fromLngLat(DESTINATION_LONGITUDE, DESTINATION_LATITUDE);
80       fetchRoute(origin, destination);
81   }
82
83   @Override
84   public void onCancelNavigation() {
85       navigationView.stopNavigation();
86       stopNavigation();
87   }
88
89   @Override
90   public void onNavigationFinished() {
91       // no-op
92   }
93
94   @Override
95   public void onNavigationRunning() {
96       // no-op
97   }
98
99   private void fetchRoute(Point origin, Point destination) {
100
101       Point origin1 = Point.fromLngLat(78.39382912963629, 17.49361551715865);
102       Point destination1 = Point.fromLngLat(78.39086260646582, 17.484744887695726);
103
104       NBNavigation.fetchRoute(origin1, destination1, new Callback<DirectionsResponse>() {
105           @Override
106           public void onResponse(@NonNull Call<DirectionsResponse> call, @NonNull Response<DirectionsResponse> response) {
107
108               //start navigation with the route we just fetched.
109               if (response.body() != null && !response.body().routes().isEmpty()) {
110                   directionsRoute = response.body().routes().get(0);
111                   startNavigation();
112               }
113           }
114
115           @Override
116           public void onFailure(@NonNull Call<DirectionsResponse> call, @NonNull Throwable t) {
117
118           }
119       });
120   }
121
122   private void startNavigation() {
123       if (directionsRoute == null) {
124           return;
125       }
126       NavViewConfig options = NavViewConfig.builder()
127               .route(directionsRoute)
128               .shouldSimulateRoute(true)
129               .navigationListener(NavigationFragment.this)
130               .build();
131       navigationView.startNavigation(options);
132   }
133
134   private void stopNavigation() {
135
136   }
137}

Code Highlights

This code example shows how to display the map view and start navigation in a fragment. Different from activity, in fragment to keep the map working normally, the following methods must be overridden:

  1. onStart()

  2. onResume()

  3. onSaveInstanceState()

  4. onViewStateRestored()

  5. onPause()

  6. onStop()

  7. onLowMemory()

  8. onDestroyView()

Code summary

The NavigationFragment class extends Fragment and implements the OnNavigationReadyCallback and NavigationListener interfaces. It uses the NextbillionMap library to display a map and navigate between two points.

The class has the following members:

  1. ORIGIN_LONGITUDE: The longitude of the origin point.

  2. ORIGIN_LATITUDE: The latitude of the origin point.

  3. DESTINATION_LONGITUDE: The longitude of the destination point.

  4. DESTINATION_LATITUDE: The latitude of the destination point.

  5. navigationView: A NavigationView object that displays the map.

  6. directionsRoute: A DirectionsRoute object that represents the route between the origin and destination points.

The class implements the following methods:

  1. onCreateView(): This method is called when the fragment is created. It inflates the layout for the fragment and initializes the NavigationView object.

  2. onViewCreated(): This method is called after the fragment's view has been created. It sets the NavigationView object's OnNavigationReadyCallback and NavigationListener interfaces to the NavigationFragment class.

  3. onStart(): This method is called when the fragment starts. It calls the onStart() method of the NavigationView object.

  4. onResume(): This method is called when the fragment resumes. It calls the onResume() method of the NavigationView object.

  5. onSaveInstanceState(): This method is called when the fragment is saved to the savedInstanceState. It calls the onSaveInstanceState() method of the NavigationView object.

  6. onViewStateRestored(): This method is called when the fragment's state is restored from the savedInstanceState. It calls the onViewStateRestored() method of the NavigationView object.

  7. onPause(): This method is called when the fragment pauses. It calls the onPause() method of the NavigationView object.

  8. onStop(): This method is called when the fragment stops. It calls the onStop() method of the NavigationView object.

  9. onLowMemory(): This method is called when the device is low on memory. It calls the onLowMemory() method of the NavigationView object.

  10. onDestroyView(): This method is called when the fragment's view is destroyed. It calls the onDestroyView() method of the NavigationView object.

  11. onNavigationReady(): This method is called when the NavigationView object is ready. It fetches the route between the origin and destination points and starts navigation.

  12. onCancelNavigation(): This method is called when the user cancels navigation. It stops navigation.

  13. onNavigationFinished(): This method is called when navigation is finished.

  14. onNavigationRunning(): This method is called when navigation is running.

  15. fetchRoute(): This method fetches the route between the origin and destination points.

  16. startNavigation(): This method starts navigation with the route that was fetched.

  17. stopNavigation(): This method stops navigation.

DIDN'T FIND WHAT YOU LOOKING FOR?