Personnalisation de l'interface utilisateur Android

La classe ConsumerMapStyle comporte des méthodes setter et getter qui vous permettent de personnaliser dynamiquement les repères et les polylignes. Cette classe est exposée de manière asynchrone à l'aide de la méthode ConsumerController.getConsumerMapStyle().

La personnalisation de l'UI persiste lors des rotations de l'appareil et reste effective jusqu'à ce que ConsumerController soit dissocié.

Repères personnalisés

La méthode pour définir le type de repère et ses propriétés est ConsumerMapStyle.setMarkerStyleOptions(). Vos options de repère personnalisés remplacent les valeurs par défaut fournies par le SDK client. Pour restaurer les valeurs par défaut, appelez setMarkerStyleOptions() en utilisant la valeur "null" pour le paramètre MarkerOptions. Récupérez l'élément MarkerOptions actif à l'aide de getMarkerStyleOptions().

Types de repères

Vous pouvez personnaliser les repères suivants:

  • TRIP_PICKUP_POINT
  • TRIP_DROPOFF_POINT
  • TRIP_INTERMEDIATE_DESTINATION
  • TRIP_VEHICLE

Affichage de TRIP_PICKUP_POINT et TRIP_DROPOFF_POINT pendant la surveillance du trajet.

TRIP_VEHICLE s'affiche lors de la surveillance des trajets. L'icône du repère ne change pas en fonction du type de véhicule réel pour le trajet. Le SDK Consumer met à jour la rotation de l'icône TRIP_VEHICLE lors de la surveillance du trajet pour imiter le comportement du véhicule réel pendant le trajet.

Options de repère

Les propriétés personnalisables disponibles pour chaque repère correspondent à l'ensemble des propriétés fournies par Google Maps MarkerOptions.

MarkerOptions est créé à l'aide de son constructeur, et les propriétés personnalisées sont spécifiées à l'aide des méthodes de style "Setter". Comme des valeurs par défaut sont fournies pour chaque propriété, il vous suffit de spécifier des valeurs personnalisées.

Vous pouvez désactiver un repère en définissant visible sur false. Vous devez fournir suffisamment de données pour pouvoir utiliser votre propre élément d'interface utilisateur à la place.

Exemple

Java

// Initializing marker options.
consumerController
    .getConsumerMapStyle()
    .addOnSuccessListener(
        consumerMapStyle -> {
          consumerMapStyle.setMarkerStyleOptions(
              MarkerType.TRIP_VEHICLE,
              new MarkerOptions()
                  .visible(false));
        });

// Reset marker options to default values.
consumerMapStyle.setMarkerStyleOptions(MarkerType.TRIP_VEHICLE, null);

Kotlin

// Initializing marker options.
consumerController
  .getConsumerMapStyle()
  .addOnSuccessListener({ consumerMapStyle ->
    consumerMapStyle.setMarkerStyleOptions(MarkerType.TRIP_VEHICLE, MarkerOptions().visible(false))
  })

// Reset marker options to default values.
consumerMapStyle.setMarkerStyleOptions(MarkerType.TRIP_VEHICLE, null)

Polylignes personnalisées

La personnalisation des polylignes est définie à l'aide de la méthode ConsumerMapStyle.setPolylineStyleOptions. Les options de polyligne personnalisées remplacent les valeurs par défaut fournies par le SDK client. Les valeurs par défaut peuvent être restaurées en appelant setPolylineStyleOptions avec une valeur nulle pour le paramètre PolylineOptions. Le PolylineOptions actif peut être récupéré à l'aide de la méthode getPolylineStyleOptions.

Types de polylignes

Vous pouvez personnaliser les types de polylignes suivants:

  • ACTIVE_ROUTE
  • REMAINING_ROUTE

ACTIVE_ROUTE et REMAINING_ROUTE s'affichent lors de la surveillance de trajet et représentent l'itinéraire du véhicule.

Propriétés des polylignes

Les propriétés personnalisables disponibles pour chaque polyligne sont fournies par Google Maps PolylineOptions. PolylineOptions est créé à l'aide de son constructeur, et les propriétés personnalisées sont spécifiées à l'aide des méthodes de style "Setter". Des valeurs par défaut sont fournies pour chaque propriété. Il vous suffit donc de spécifier des valeurs personnalisées. Vous pouvez désactiver la polyligne en définissant visible sur false.

Exemple

Java

// Initializing polyline style options.
consumerController
    .getConsumerMapStyle()
    .addOnSuccessListener(
        consumerMapStyle -> {
          consumerMapStyle.setPolylineStyleOptions(
              PolylineType.ACTIVE_ROUTE,
              new PolylineOptions()
                  .visible(false));
        });

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null);

Kotlin

// Initializing polyline options.
consumerController
  .getConsumerMapStyle()
  .addOnSuccessListener({ consumerMapStyle ->
    consumerMapStyle.setPolylineStyleOptions(
      PolylineType.ACTIVE_ROUTE,
      PolylineOptions().visible(false)
    )
  })

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null)

Itinéraire actif et restant

Lorsque la fonctionnalité Trip and Order Progress est activée, votre application peut personnaliser l'expérience utilisateur à l'aide de polylignes affichant l'itinéraire actif et l'itinéraire restant.

L'itinéraire actif correspond au chemin que le véhicule emprunte actuellement pour atteindre le prochain point de cheminement du trajet actif du consommateur. L'itinéraire restant correspond au chemin parcouru par le véhicule après l'itinéraire actif. Lorsque le point de cheminement d'un itinéraire actif est le dernier point de cheminement du trajet, l'itinéraire restant n'existe pas.

Les polylignes actives et restantes peuvent être personnalisées, et la visibilité peut être contrôlée par votre application. Par défaut, l'itinéraire actif est visible, et l'itinéraire restant n'est pas visible.

Exemple

Java

// Initializing polyline options.
consumerController
    .getConsumerMapStyle()
    .addOnSuccessListener(
        consumerMapStyle -> {
          consumerMapStyle.setPolylineStyleOptions(
              PolylineType.ACTIVE_ROUTE,
              new PolylineOptions()
                  .color(Color.BLUE));
          consumerMapStyle.setPolylineStyleOptions(
              PolylineType.REMAINING_ROUTE,
              new PolylineOptions()
                  .color(Color.BLACK)
                  .width(5)
                  .visible(true));
        });

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null);
consumerMapStyle.setPolylineStyleOptions(PolylineType.REMAINING_ROUTE, null);

Kotlin

// Initializing polyline options.
consumerController
  .getConsumerMapStyle()
  .addOnSuccessListener({ consumerMapStyle ->
    {
      consumerMapStyle.setPolylineStyleOptions(
        PolylineType.ACTIVE_ROUTE,
        PolylineOptions().color(Color.BLUE)
      )

      consumerMapStyle.setPolylineStyleOptions(
        PolylineType.REMAINING_ROUTE,
        PolylineOptions().color(Color.BLACK).width(5).visible(true)
      )
    }
  })

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null)

consumerMapStyle.setPolylineStyleOptions(PolylineType.REMAINING_ROUTE, null)

Polylignes sensibles au trafic

Le calque de trafic de la polyligne est désactivé par défaut. Lorsque cette option est activée, des sections représentant des tronçons de trafic inhabituel sont tracés au-dessus de la polyligne de l'itinéraire au niveau de la valeur z-index PolylineOptions.getZIndex(), plus un décalage en fonction des conditions de circulation.

Les conditions de circulation sont représentées par l'un des quatre types de vitesse. Vous pouvez personnaliser la couleur de chaque type de vitesse.

Pour activer les polylignes sensibles au trafic, vous devez construire un objet TrafficStyle qui sera ensuite transmis à ConsumerMapStyle en appelant setPolylineTrafficStyle().

Exemple

Java

// TrafficStyle is part of the Consumer SDK.
TrafficStyle trafficStyle = TrafficStyle.builder()
  .setTrafficVisibility(true)
  .setTrafficColor(SpeedType.NO_DATA, Color.GREY)
  .setTrafficColor(SpeedType.NORMAL_VALUE, Color.BLUE)
  .setTrafficColor(SpeedType.SLOW_VALUE, Color.ORANGE)
  .setTrafficColor(SpeedType.TRAFFIC_JAM, Color.RED)
  .build();

consumerMapStyle.setPolylineTrafficStyle(PolylineType.ACTIVE_ROUTE, trafficStyle);

Kotlin

// TrafficStyle is part of the Consumer SDK.
val trafficStyle =
  TrafficStyle.builder()
    .setTrafficVisibility(true)
    .setTrafficColor(SpeedType.NO_DATA, Color.GREY)
    .setTrafficColor(SpeedType.NORMAL_VALUE, Color.BLUE)
    .setTrafficColor(SpeedType.SLOW_VALUE, Color.ORANGE)
    .setTrafficColor(SpeedType.TRAFFIC_JAM, Color.RED)
    .build()

consumerMapStyle.setPolylineTrafficStyle(PolylineType.ACTIVE_ROUTE, trafficStyle)

Ajuster le zoom de l'appareil photo pour faire la mise au point sur un trajet

Le bouton "Ma position" par défaut intégré au SDK Maps centre la caméra sur la position de l'appareil. Si une session de progression du trajet et de la commande est active, il peut être judicieux de centrer la caméra pour qu'elle se concentre sur le trajet plutôt que sur la position de l'appareil.

SDK grand public pour la solution intégrée Android: AutoCamera

Pour vous permettre de vous concentrer sur le parcours plutôt que sur l'emplacement de l'appareil, le SDK grand public fournit une fonctionnalité AutoCamera, activée par défaut. La caméra effectue un zoom pour faire la mise au point sur l'itinéraire de progression du trajet et de la commande et sur le point de cheminement suivant du trajet.

Personnaliser le comportement de la caméra

Si vous avez besoin de mieux contrôler le comportement de l'appareil photo, vous pouvez désactiver ou activer la fonctionnalité AutoCamera à l'aide de ConsumerController.setAutoCameraEnabled().

ConsumerController.getCameraUpdate() renvoie les limites de caméra recommandées à ce moment précis. Vous pouvez ensuite fournir ce CameraUpdate en tant qu'argument à GoogleMap.moveCamera() ou GoogleMap.animateCamera().