Ce guide décrit comment personnaliser la carte qui s'affiche dans vos l'application Android lorsque vous suivez un trajet. Vous pouvez personnaliser l'apparence la carte de différentes manières:
- Appliquer un style à la carte dans le cloud
- Réglez la caméra pour faire la mise au point sur le trajet
- Personnaliser les repères
- Personnaliser des polylignes
Appliquer des styles de cartes basés dans le cloud à la carte
Personnalisez l'apparence du composant Maps à l'aide de styles de carte basés dans le cloud. Vous pouvez créer et modifier des styles de carte dans la console Google Cloud pour de vos applications qui utilisent Google Maps, sans avoir à modifier votre code. Pour en savoir plus, consultez 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 le moteur de rendu de cartes sélectionné est LATEST
. Les sections suivantes montrent comment utiliser le style des cartes dans le cloud avec votre projet.
ConsumerMapView
Pour utiliser les styles de cartes basés dans le cloud dans ConsumerMapView
, définissez
mapId
sur GoogleMapOptions
et transmettez GoogleMapOptions
à
getConsumerGoogleMapAsync(ConsumerMapReadyCallback, Fragment,
GoogleMapOptions)
ou 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 XML.
- Dynamiquement avec
newInstance
.
De manière statique avec le fichier 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
}
}
Ajustez le zoom de l'appareil photo pour faire la mise au point sur un trajet
Pendant une session active de partage de parcours, vous pouvez gérer le zoom de la caméra et vous pouvez vous concentrer de l'une des deux manières suivantes:
AutoCamera
: si vous souhaitez utiliserAutoCamera
, vous n'avez rien à faire. La caméra suit le trajet. Pour en savoir plus, consultezAutoCamera
Personnaliser le comportement de la caméra : pour personnaliser le comportement de la caméra, vous devez désactiver
AutoCamera
, puis effectuer vos personnalisations. Pour en savoir plus, consultez la section Personnaliser le comportement de la caméra.
AutoCamera
centre la caméra
Le SDK Consumer fournit une fonctionnalité AutoCamera
activée par défaut sur le bouton Mon emplacement intégré du SDK Maps. La caméra zoome sur
se concentrer sur le partage de l'itinéraire
et le point de cheminement du prochain trajet.
Si vous souhaitez utiliser AutoCamera
, veillez à l'activer. Pour en savoir plus, consultez
isAutoCameraEnabled
Pour plus d'informations sur le bouton Ma position, consultez l'article Bouton "Ma position" dans la documentation de l'API Maps JavaScript.
Personnaliser le comportement de la caméra
Pour mieux contrôler le comportement de la caméra, suivez ces étapes pour désactiver
AutoCamera
et personnaliser manuellement le comportement de la caméra.
Désactivez
AutoCamera
à l'aide de ConsumerController.setAutoCameraEnabled().Obtenez les limites de caméra recommandées à l'aide de ConsumerController.getCameraUpdate().
Fournissez
CameraUpdate
en tant qu'argument à l'une des fonctions Android suivantes :