自定义导航界面

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

查看代码

自定义导航标题

使用 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));
}

请务必将生命周期事件转发到 DirectionsListView,就像处理 NaviagtionView 一样。例如:

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);