ConsumerMapStyle
dispose de méthodes setter et getter qui vous offrent une personnalisation dynamique.
pour 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'interface utilisateur persiste entre les rotations d'appareil et reste effective jusqu'à
ConsumerController
est détachée.
Repères personnalisés
La méthode permettant de définir le type de repère et ses propriétés est ConsumerMapStyle.setMarkerStyleOptions()
. Votre
Les options des repères remplacent les valeurs par défaut fournies par le SDK grand public.
Pour restaurer les valeurs par défaut, appelez setMarkerStyleOptions()
avec la valeur "null"
pour le paramètre MarkerOptions
. Récupérer l'élément MarkerOptions
actif
avec
getMarkerStyleOptions()
Types de repères
Vous pouvez personnaliser les repères suivants:
TRIP_PICKUP_POINT
TRIP_DROPOFF_POINT
TRIP_INTERMEDIATE_DESTINATION
TRIP_VEHICLE
TRIP_PICKUP_POINT
et TRIP_DROPOFF_POINT
s'affichent pendant la surveillance des trajets.
TRIP_VEHICLE
s'affiche pendant la surveillance des trajets. L'icône du repère ne change pas.
en fonction du type de véhicule réel du trajet. Mises à jour du SDK grand public
la rotation de l'icône TRIP_VEHICLE
lors de la surveillance du trajet pour imiter la
le comportement du véhicule
sur l'itinéraire.
Options de repère
Les propriétés personnalisables disponibles pour chaque repère sont l'ensemble des
établissements fournis 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 de la méthode "Setter". méthodes de style graphique.
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 un repère en définissant visible
sur false
.
Vous devez fournir suffisamment de données pour vous permettre d'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
. Définir des options de polyligne personnalisées
remplace les valeurs par défaut fournies par le SDK grand public. Les valeurs par défaut
peuvent être restaurées en appelant setPolylineStyleOptions
avec la valeur "null" pour le paramètre PolylineOptions
. L'état actif
PolylineOptions
peut être récupérée à l'aide de
getPolylineStyleOptions
.
Types de polylignes
Les types de polylignes suivants peuvent être personnalisés:
ACTIVE_ROUTE
REMAINING_ROUTE
ACTIVE_ROUTE
et REMAINING_ROUTE
s'affichent pendant la surveillance des trajets et
qui 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 de la méthode "Setter". méthodes de style graphique. 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 progression du trajet et de la commande est activée, votre application peut personnaliser les l'expérience utilisateur à l'aide de polylignes montrant vos véhicules actifs et restants ; via un routage réseau.
L'itinéraire actif correspond au chemin que le véhicule doit parcourir pour atteindre le prochain point de cheminement dans le trajet actif du client. L'itinéraire restant est le parcours que le véhicule empruntera après l'itinéraire actif. Lorsque la route active point de cheminement est le dernier point de cheminement du trajet, l'itinéraire restant n'existe pas.
Vous pouvez personnaliser les polylignes actives et restantes, et contrôler la visibilité par votre application. Par défaut, la route active est visible et la route restante 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 tenant compte du trafic
Le calque de trafic de la polyligne est désactivé par défaut. Lorsqu'il est activé, les segments représentant des portions de trafic anormal sont tracées au-dessus de la polyligne de l'itinéraire. au niveau du z-index PolylineOptions.getZIndex(), plus un décalage en fonction des conditions du trafic.
Les conditions de circulation sont représentées par l'une des quatre types de vitesse. Vous pouvez personnaliser la couleur pour chaque type de vitesse.
Pour activer les polylignes basées sur le 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)
Réglage du zoom de l'appareil photo pour faire la mise au point sur un trajet
Le bouton "Ma position" par défaut intégrée au SDK Maps centre la caméra sur la position de l'appareil. S'il y a une session active de trajet et de progression de la commande, vous pouvez centrer de se concentrer sur le trajet plutôt que sur la position de l'appareil.
Solution intégrée au SDK grand public pour Android: AutoCamera
Pour vous permettre de vous concentrer sur le parcours plutôt que sur la localisation de l'appareil, le SDK grand public propose une fonctionnalité AutoCamera activée par défaut. La caméra zoome pour vous concentrer sur l'itinéraire de progression du trajet et de la commande, ainsi que sur le point de cheminement du trajet suivant.
Personnaliser le comportement de l'appareil photo
Si vous avez besoin de mieux contrôler le comportement de la caméra, vous pouvez activer ou désactiver
Appareil photo automatique avec ConsumerController.setAutoCameraEnabled()
.
ConsumerController.getCameraUpdate()
renvoie les limites recommandées pour l'appareil photo à ce moment précis. Vous pouvez
puis fournissez ce CameraUpdate
comme argument pour
GoogleMap.moveCamera()
ou GoogleMap.animateCamera()
.
Styles de cartes basés dans le cloud
Les
ConsumerMapView
et
ConsumerMapFragment
sont compatibles avec les styles de cartes basés dans le cloud.
Pour utiliser les styles de cartes basés dans le cloud, assurez-vous que les cartes sélectionnées
est LATEST
. Les exemples suivants montrent comment utiliser
des styles de cartes basés dans le cloud pour votre projet.
ConsumerMapView
Pour utiliser les styles de cartes basés dans le cloud dans ConsumerMapView
, définissez
le champ mapId
sur GoogleMapOptions
et transmettez GoogleMapOptions
à
getConsumerGoogleMapAsync(ConsumerMapReadyCallback, Fragment,
GoogleMapOptions)
or getConsumerGoogleMapAsync(ConsumerMapReadyCallback, FragmentActivity,
GoogleMapOptions)
Exemple
Java
public class SampleAppActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
ConsumerMapView mapView = findViewById(R.id.consumer_map_view);
if (mapView != null) {
GoogleMapOptions optionsWithMapId = new GoogleMapOptions().mapId("map-id");
mapView.getConsumerGoogleMapAsync(
new ConsumerMapReadyCallback() {
@Override
public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
// ...
}
},
/* fragmentActivity= */ this,
/* googleMapOptions= */ optionsWithMapId);
}
}
}
Kotlin
class SampleAppActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
val mapView = findViewById(R.id.consumer_map_view) as ConsumerMapView
val optionsWithMapId = GoogleMapOptions().mapId("map-id")
mapView.getConsumerGoogleMapAsync(
object : ConsumerGoogleMap.ConsumerMapReadyCallback() {
override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
// ...
}
},
/* fragmentActivity= */ this,
/* googleMapOptions= */ optionsWithMapId)
}
}
ConsumerMapFragment
Il existe deux façons d'utiliser les styles de cartes basés dans le cloud ConsumerMapFragments:
- Statiquement avec le fichier XML.
- Dynamiquement avec
newInstance
.
De manière statique avec le code XML
Pour utiliser les styles de cartes basés dans le cloud avec le code XML dans la
ConsumerMapFragment
, ajoutez l'attribut XML map:mapId
avec l'attribut
mapId
Consultez l'exemple ci-dessous :
<fragment
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map="http://schemas.android.com/apk/res-auto"
android:name="com.google.android.libraries.mapsplatform.transportation.consumer.view.ConsumerMapFragment"
android:id="@+id/consumer_map_fragment"
map:mapId="map-id"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
Dynamiquement avec newInstance
Pour utiliser les styles de cartes basés dans le cloud avec newInstance
dans
ConsumerMapFragment
, définissez le champ mapId
sur GoogleMapOptions
et transmettez la
GoogleMapOptions
à newInstance
. Consultez l'exemple ci-dessous :
Java
public class SampleFragmentJ extends Fragment {
@Override
public View onCreateView(
@NonNull LayoutInflater inflater,
@Nullable ViewGroup container,
@Nullable Bundle savedInstanceState) {
final View view = inflater.inflate(R.layout.consumer_map_fragment, container, false);
GoogleMapOptions optionsWithMapId = new GoogleMapOptions().mapId("map-id");
ConsumerMapFragment consumerMapFragment = ConsumerMapFragment.newInstance(optionsWithMapId);
getParentFragmentManager()
.beginTransaction()
.add(R.id.consumer_map_fragment, consumerMapFragment)
.commit();
consumerMapFragment.getConsumerGoogleMapAsync(
new ConsumerMapReadyCallback() {
@Override
public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
// ...
}
});
return view;
}
}
Kotlin
class SampleFragment : Fragment() {
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?): View? {
val view = inflater.inflate(R.layout.consumer_map_fragment, container, false)
val optionsWithMapId = GoogleMapOptions().mapId("map-id")
val consumerMapFragment = ConsumerMapFragment.newInstance(optionsWithMapId)
parentFragmentManager
.beginTransaction()
.add(R.id.consumer_map_fragment, consumerMapFragment)
.commit()
consumerMapFragment.getConsumerGoogleMapAsync(
object : ConsumerMapReadyCallback() {
override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
// ...
}
})
return view
}
}