Load NavigationView in Fragment

How to use NavigationView to navigate in Fragment?

Add NavigationView in Fragment
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
2
public void onStart() {
3
   super.onStart();
4
   navigationView.onStart();
5
}
6

7
@Override
8
public void onResume() {
9
   super.onResume();
10
   navigationView.onResume();
11
}
12

13
@Override
14
public void onSaveInstanceState(@NonNull Bundle outState) {
15
   navigationView.onSaveInstanceState(outState);
16
   super.onSaveInstanceState(outState);
17
}
18

19
@Override
20
public void onViewStateRestored(@Nullable Bundle savedInstanceState) {
21
   super.onViewStateRestored(savedInstanceState);
22
   if (savedInstanceState != null) {
23
       navigationView.onRestoreInstanceState(savedInstanceState);
24
   }
25
}
26

27
@Override
28
public void onPause() {
29
   super.onPause();
30
   navigationView.onPause();
31
}
32

33
@Override
34
public void onStop() {
35
   super.onStop();
36
   navigationView.onStop();
37
}
38

39
@Override
40
public void onLowMemory() {
41
   super.onLowMemory();
42
   navigationView.onLowMemory();
43
}
44

45
@Override
46
public 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

1
public 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

1
public 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:

onStart()
onResume()
onSaveInstanceState()
onViewStateRestored()
onPause()
onStop()
onLowMemory()
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:

ORIGIN_LONGITUDE: The longitude of the origin point.
ORIGIN_LATITUDE: The latitude of the origin point.
DESTINATION_LONGITUDE: The longitude of the destination point.
DESTINATION_LATITUDE: The latitude of the destination point.
navigationView: A NavigationView object that displays the map.
directionsRoute: A DirectionsRoute object that represents the route between the origin and destination points.

The class implements the following methods:

onCreateView(): This method is called when the fragment is created. It inflates the layout for the fragment and initializes the NavigationView object.
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.
onStart(): This method is called when the fragment starts. It calls the onStart() method of the NavigationView object.
onResume(): This method is called when the fragment resumes. It calls the onResume() method of the NavigationView object.
onSaveInstanceState(): This method is called when the fragment is saved to the savedInstanceState. It calls the onSaveInstanceState() method of the NavigationView object.
onViewStateRestored(): This method is called when the fragment's state is restored from the savedInstanceState. It calls the onViewStateRestored() method of the NavigationView object.
onPause(): This method is called when the fragment pauses. It calls the onPause() method of the NavigationView object.
onStop(): This method is called when the fragment stops. It calls the onStop() method of the NavigationView object.
onLowMemory(): This method is called when the device is low on memory. It calls the onLowMemory() method of the NavigationView object.
onDestroyView(): This method is called when the fragment's view is destroyed. It calls the onDestroyView() method of the NavigationView object.
onNavigationReady(): This method is called when the NavigationView object is ready. It fetches the route between the origin and destination points and starts navigation.
onCancelNavigation(): This method is called when the user cancels navigation. It stops navigation.
onNavigationFinished(): This method is called when navigation is finished.
onNavigationRunning(): This method is called when navigation is running.
fetchRoute(): This method fetches the route between the origin and destination points.
startNavigation(): This method starts navigation with the route that was fetched.
stopNavigation(): This method stops navigation.

Load NavigationView in Fragment

Code Highlights

Code summary

PRODUCTS

SOLUTIONS

COMPARE

DEVELOPERS

GUIDES

RESOURCES

COMPANY

UNITED STATES

SINGAPORE