Customize styling of the dissolved route line

1<resources xmlns:tools="http://schemas.android.com/tools">
2   <!-- Set dissolved route line style by navViewRouteStyle -->
3   <style name="Theme.CustomNavDissolvedRouteline" parent="NavigationViewLight">
4       <item name="navViewRouteStyle">@style/CustomNavDissolvedRouteLineStyle</item>
5   </style>
6
7   <style name="CustomNavDissolvedRouteLineStyle" parent="NavigationMapRoute">
8       <!-- Is how many times the width of the normal route -->
9       <item name="alternativeRouteScale">1.0</item>
10       <!-- The colour of dissolved route line -->
11       <item name="navigationDissolvedRouteColor">#FFFF0106</item>
12       <!-- The current color of the animation effect in 1 second -->
13       <item name="navigationDissolvedAnimatedRouteColor">#FF54E910</item>
14
15   </style>
16</resources>

1public class CustomDissolvedLineStyleActivity extends AppCompatActivity implements View.OnClickListener{
2
3   private Button fetchRoute;
4   private Button startNav;
5   private TextView routeGeometry;
6   private DirectionsRoute directionsRoute;
7   private ProgressBar progress;
8
9   @Override
10   protected void onCreate(Bundle savedInstanceState) {
11       super.onCreate(savedInstanceState);
12       setContentView(R.layout.activity_custom_dissolved_line_style);
13
14       fetchRoute = findViewById(R.id.fetchRoute);
15       startNav = findViewById(R.id.startNav);
16       routeGeometry = findViewById(R.id.routeGeometry);
17       progress = findViewById(R.id.progress);
18       fetchRoute.setOnClickListener(this);
19       startNav.setOnClickListener(this);
20       startNav.setEnabled(false);
21   }
22
23   @Override
24   public void onClick(View view) {
25       if (view.getId() == R.id.fetchRoute) {
26           progress.setVisibility(View.VISIBLE);
27           Point origin = Point.fromLngLat(103.75986708439264, 1.312533169133601);
28           Point destination = Point.fromLngLat(103.77982271935586, 1.310473772283314);
29
30           NBNavigation.fetchRoute(origin, destination, new Callback<DirectionsResponse>() {
31               @Override
32               public void onResponse(@NonNull Call<DirectionsResponse> call, @NonNull Response<DirectionsResponse> response) {
33                   progress.setVisibility(View.GONE);
34                   //start navigation with the route we just fetched.
35                   if (response.body() != null && !response.body().routes().isEmpty()) {
36                       directionsRoute = response.body().routes().get(0);
37                       routeGeometry.setText(String.format("Route Geometry: %s", directionsRoute.geometry()));
38                       startNav.setEnabled(true);
39                   }
40               }
41
42               @Override
43               public void onFailure(@NonNull Call<DirectionsResponse> call, @NonNull Throwable t) {
44                   progress.setVisibility(View.GONE);
45               }
46           });
47       } else if (view.getId() == R.id.startNav) {
48           NavLauncherConfig.Builder configBuilder = NavLauncherConfig.builder(directionsRoute);
49           configBuilder.locationLayerRenderMode(RenderMode.GPS);
50           configBuilder.shouldSimulateRoute(true);
51           // Set dissolved rout line styling by lightThemeResId resource
52        configBuilder.lightThemeResId(R.style.Theme_CustomNavDissolvedRouteline);
53           NavigationLauncher.startNavigation(CustomDissolvedLineStyleActivity.this, configBuilder.build());
54       }
55   }
56}

1<?xml version="1.0" encoding="utf-8"?>
2<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3   android:layout_width="match_parent"
4   android:layout_height="match_parent"
5   android:orientation="vertical"
6   android:padding="10dp">
7
8   <LinearLayout
9       android:layout_width="wrap_content"
10       android:orientation="vertical"
11       android:layout_height="wrap_content">
12       <Button
13           android:id="@+id/fetchRoute"
14           android:layout_width="wrap_content"
15           android:layout_height="wrap_content"
16           android:textSize="12sp"
17           android:text="@string/fetch_route"/>
18
19       <Button
20           android:id="@+id/startNav"
21           android:layout_width="wrap_content"
22           android:layout_height="wrap_content"
23           android:textSize="12sp"
24           android:text="@string/start_navigation_with_custom_top_panel"/>
25   </LinearLayout>
26
27   <TextView
28       android:id="@+id/routeGeometry"
29       android:layout_width="wrap_content"
30       android:layout_height="wrap_content"
31       android:layout_marginTop="10dp"/>
32
33   <ProgressBar
34       android:id="@+id/progress"
35       android:visibility="gone"
36       android:layout_width="wrap_content"
37       android:layout_height="wrap_content"
38       android:layout_gravity="center"/>
39
40</LinearLayout>

1NavLauncherConfig.Builder configBuilder = NavLauncherConfig.builder(directionsRoute);
2configBuilder.locationLayerRenderMode(RenderMode.GPS);
3configBuilder.shouldSimulateRoute(true);
4// Set dissolved rout line styling by lightThemeResId resource
5configBuilder.lightThemeResId(R.style.Theme_CustomNavDissolvedRouteline);
6NavigationLauncher.startNavigation(CustomDissolvedLineStyleActivity.this, configBuilder.build());