自定义导航界面

您可以自定义导航界面和地图的元素,并向地图添加自定义标记。如需了解有关可以接受的 Navigation 界面修改的准则,请参阅政策页面

查看代码

自定义导航标题

使用 NavigationFragment.setStylingOptions()NavigationView.setStylingOptions() 可更改导航标题的主题,以及标题下方显示的下一个转弯指示符(如果有)。

您可以设置以下属性:

属性类型属性
背景颜色
  • 主要日间模式 - 导航标题的白天颜色
  • 次要日间模式 - 下一个转弯指示灯的白天颜色
  • 主要夜间模式 - 导航标题的夜间颜色
  • 次要夜间模式 - 下一个转弯指示灯的夜间颜色
说明的文本元素
  • 文本颜色
  • 字体
  • 第一行的文字大小
  • 第二行的文字大小
后续步骤的文本元素
  • 字体
  • 距离值的文本颜色
  • 距离值的文本大小
  • 距离单位的文字颜色
  • 距离单位的文字大小
操作图标
  • 大型操作图标的颜色
  • 小操作图标的颜色
车道导航
  • 推荐车道的颜色

以下示例展示了如何设置样式选项:

private NavigationFragment mNavFragment;
mNavFragment = (NavigationFragment) getFragmentManager()
        .findFragmentById(R.id.navigation_fragment);
// Set the styling options on the fragment.
mNavFragment.setStylingOptions(new StylingOptions()
        .primaryDayModeThemeColor(0xff1A237E)
        .secondaryDayModeThemeColor(0xff3F51B5)
        .primaryNightModeThemeColor(0xff212121)
        .secondaryNightModeThemeColor(0xff424242)
        .headerLargeManeuverIconColor(0xffffff00)
        .headerSmallManeuverIconColor(0xffffa500)
        .headerNextStepTypefacePath("/system/fonts/NotoSerif-BoldItalic.ttf")
        .headerNextStepTextColor(0xff00ff00)
        .headerNextStepTextSize(20f)
        .headerDistanceTypefacePath("/system/fonts/NotoSerif-Italic.ttf")
        .headerDistanceValueTextColor(0xff00ff00)
        .headerDistanceUnitsTextColor(0xff0000ff)
        .headerDistanceValueTextSize(20f)
        .headerDistanceUnitsTextSize(18f)
        .headerInstructionsTypefacePath("/system/fonts/NotoSerif-BoldItalic.ttf")
        .headerInstructionsTextColor(0xffffff00)
        .headerInstructionsFirstRowTextSize(24f)
        .headerInstructionsSecondRowTextSize(20f)
        .headerGuidanceRecommendedLaneColor(0xffffa500));

停用路况图层

使用 NavigationMap.setTrafficEnabled() 在地图上启用或停用路况图层。此设置会影响整个地图上显示的交通密度指示,但不会影响导航器所绘制路线上的路况指示。

private NavigationMap mMap;
// Get the map.
mMap = mNavFragment.getMap();
// Turn off the traffic layer on the map.
mMap.setTrafficEnabled(false);

添加自定义标记

您可以向地图添加自定义标记,以指示应用或用户地图注点。例如,您可能需要在路线的尽头指明上车点。使用 NavigationMap.addMarker() 添加标记,使用 NavigationMap.setOnMarkerClickListener() 监听标记上的点按操作。

以下代码使用存储在项目的可绘制资源 R.drawable.ic_person_pin_48dp 中的图标。您可以使用任何适合您的应用的图片。

// Place a marker at the final destination.
if (mNavigator.getCurrentRouteSegment() != null) {
    LatLng destinationLatLng = mNavigator.getCurrentRouteSegment()
        .getDestinationLatLng();

    Bitmap destinationMarkerIcon = BitmapFactory.decodeResource(
            getResources(), R.drawable.ic_person_pin_48dp);

    mMap.addMarker(new MarkerOptions()
            .position(destinationLatLng)
            .icon(destinationMarkerIcon)
            .title("Destination marker"));

    // Listen for a tap on the marker.
    mMap.setOnMarkerClickListener(new NavigationMap.OnMarkerClickListener() {
        @Override
        public void onMarkerClick(Marker marker) {
            displayMessage("Marker tapped: "
                    + marker.getTitle() + ", at location "
                    + marker.getPosition().latitude + ", "
                    + marker.getPosition().longitude);
        }
    });
}

您可以将自定义图片指定为标记;但是,SDK 目前不支持使用文本为这些图片加标签。如需了解详情,请参阅自定义标记

浮动文本

只要不涵盖 Google 归因,您就可以在应用中的任意位置添加浮动文本。Navigation SDK 不支持将文本锚定到地图上的纬度/经度,或锚定到标签上。如需了解详情,请参阅信息窗口

显示限速

您可以通过程序化方式来显示或隐藏速度限制图标。 使用 NavigationFragment.setSpeedLimitIconEnabled()NavigationView.setSpeedLimitIconEnabled()SupportNavigationFragment.setSpeedLimitIconEnabled() 显示或隐藏速度限制图标。启用后,在导航期间,速度限制图标会显示在底部角落。该图标显示车辆行驶的道路的速度限制。该图标仅在具有可靠速度限制数据的位置显示。

// Display the Speed Limit icon
mNavFragment.setSpeedLimitIconEnabled(true);

显示“重新居中”按钮时,速度限制图标会暂时隐藏。

设置夜间模式

您可以通过程序化方式控制夜间模式的行为。使用 NavigationFragment.setForceNightMode()NavigationView.setForceNightMode()SupportNavigationFragment.setForceNightMode() 开启或关闭夜间模式,或者让 Navigation SDK 控制该模式。

  • AUTO 让 Navigation SDK 根据设备位置和当地时间确定适当的模式。
  • FORCE_NIGHT 会强制开启夜间模式。
  • FORCE_DAY 强制开启日间模式。

以下示例展示了如何在导航 fragment 中强制开启夜间模式:

// Force night mode on.
mNavFragment.setForceNightMode(FORCE_NIGHT);

显示路线列表

首先,创建视图并将其添加到您的层次结构中。

setupDirectionsListView(){
  // Create the view.
  DirectionsListView directionsListView = new DirectionsListView(getApplicationContext());
  // Add the view to your view hierarchy.
  ViewGroup group = findViewById(R.id.directions_view);
  group.addView(directionsListView);

  // Add a button to your layout to close the directions list view.
  ImageButton button = findViewById(R.id.close_directions_button); // this button is part of the container we hide in the next line.
  button.setOnClickListener(
      v -> findViewById(R.id.directions_view_container).setVisibility(View.GONE));
}

请务必像使用 NaviagtionView 一样将生命周期事件转发到 DirectionsListView。例如:

protected void onResume() {
  super.onResume();
  directionsListView.onResume();
}

隐藏备选路线

当界面因信息过多而变得杂乱时,您可以通过显示少于默认路线(两个)的备选路线来减少混乱,或者不显示任何备选路线。您可以在提取路由之前配置此选项,方法是使用以下枚举值之一调用 RoutingOptions.alternateRoutesStrategy() 方法:

枚举值说明
AlternateRoutesStrategy.SHOW_ALL 默认。最多显示两条备选路线。
AlternateRoutesStrategy.SHOW_ONE 显示一条备选路线(如果有)。
AlternateRoutesStrategy.SHOW_NONE 隐藏备选路线。

示例

以下代码示例演示了如何完全隐藏备选路线。

RoutingOptions routingOptions = new RoutingOptions();
routingOptions.alternateRoutesStrategy(AlternateRoutesStrategy.SHOW_NONE);
navigator.setDestinations(destinations, routingOptions, displayOptions);