Kit d'UI Places Details (expérimental)

Le kit d'UI pour les informations sur un lieu vous permet d'ajouter un composant d'UI individuel qui affiche les informations sur un lieu dans votre application. Le kit d'UI peut être utilisé indépendamment ou en conjonction avec d'autres API et services Google Maps Platform. Le kit d'UI prend un ID de lieu ou des coordonnées de latitude/longitude, puis renvoie les informations Place Details affichées.

Le kit d'UI propose une vue compacte, qui peut être affichée horizontalement ou verticalement. Vous pouvez personnaliser l'apparence des informations sur le lieu en remplaçant l'un des attributs du thème par défaut. Vous pouvez également personnaliser les champs de détails du lieu inclus en spécifiant une liste d'entrées Content, chacune correspondant à une information affichée sur le lieu.

Facturation

Lorsque vous utilisez l'UI Kit Place Details pour Place Details, vous êtes facturé pour chaque lieu chargé à l'aide du widget. Si vous chargez le même lieu plusieurs fois, chaque requête vous est facturée.

Activer l'UI Kit Places

Avant d'utiliser l'UI Kit Places, vous devez:

• Créez un projet Cloud avec un compte de facturation.
• Activez l'API Places pour votre projet.
• Obtenez une clé API.

Exemples de kit d'UI Place Details

Vous pouvez ajouter des informations sur un lieu à votre application en ajoutant un fragment à une mise en page. Lorsque vous instanciez le fragment, vous pouvez personnaliser l'apparence des informations sur le lieu en fonction de vos besoins et de l'apparence de votre application.

Vous pouvez spécifier l'orientation (horizontale ou verticale), les forçages de thème et le contenu. Les options de contenu sont les suivantes : contenu multimédia, adresse, note, prix, type, entrée accessible, lien Maps et lien vers les itinéraires. [Voir un exemple de personnalisation]().

val fragment = PlaceDetailsCompactFragment.newInstance(
  orientation,
  listOf(Content.ADDRESS, Content.TYPE, Content.RATING, Content.ACCESSIBLE_ENTRANCE),
  R.style.CustomizedPlaceDetailsTheme,
)
      
fragment.setPlaceLoadListener(object : PlaceLoadListener {
    override fun onSuccess() { ... }
      
      override fun onFailure(e: Exception) { ... }
})
      
supportFragmentManager
  .beginTransaction()
  .add(R.id.fragment_container, fragment)
  .commitNow()
      
fragment.loadPlaceDetails(placeId)

      
PlaceDetailsCompactFragment fragment =
  PlaceDetailsCompactFragment.newInstance(
        Orientation.HORIZONTAL,
        Arrays.asList(Content.ADDRESS, Content.TYPE, Content.RATING, Content.ACCESSIBLE_ENTRANCE),
        R.style.CustomizedPlaceDetailsTheme);
    
fragment.setPlaceLoadListener(
  new PlaceLoadListener() {
        @Override
        public void onSuccess() { ... }
    
        @Override
        public void onFailure(Exception e) { ... }
});
    
getSupportFragmentManager()
      .beginTransaction()
      .add(R.id.fragment_container, fragment)
      .commitNow();
    
fragment.loadPlaceDetails(placeId);

Exemple de personnalisation

Lorsque vous instanciez un fragment, vous pouvez spécifier un thème qui remplace les attributs de style par défaut. Tous les attributs de thème qui ne sont pas remplacés utilisent les styles par défaut. Si vous souhaitez prendre en charge un thème sombre, vous pouvez ajouter une entrée pour la couleur dans values-night/colors.xml.

  <style name="CustomizedPlaceDetailsTheme" parent="PlacesTheme">
    <item name="placesColorPrimary">@color/app_primary_color</item>
    <item name="placesColorOnSurface">@color/app_color_on_surface</item>
    <item name="placesColorOnSurfaceVariant">@color/app_color_on_surface</item>
  
    <item name="placesTextAppearanceBodySmall">@style/app_text_appearence_small</item>
  
    <item name="placesCornerRadius">20dp</item>
  </style>

Vous pouvez personnaliser les styles suivants:

• placesColorSurfaceContainerLowest
• placesColorOutlineDecorative
• placesColorPrimary
• placesColorOnSurface
• placesColorOnSurfaceVariant
• placesColorSecondaryContainer
• placesColorOnSecondaryContainer
• placesCornerRadius
• placesTextAppearanceBodySmall
• placesTextAppearanceBodyMedium
• placesTextAppearanceBodyLarge
• placesTextAppearanceLabelLarge
• placesTextAppearanceHeadlineMedium
• placesColorAttributionLight (énumérations pour le blanc, le gris et le noir)
• placesColorAttributionDark (énumérations pour le blanc, le gris et le noir)

Cet exemple personnalise le contenu standard.

  val fragmentStandardContent = PlaceDetailsCompactFragment.newInstance(
  orientation,
  PlaceDetailsCompactFragment.STANDARD_CONTENT,
  R.style.BrandedPlaceDetailsTheme,
)

Cet exemple personnalise l'ensemble du contenu.

  val fragmentAllContent = PlaceDetailsCompactFragment.newInstance(
  orientation,
  PlaceDetailsCompactFragment.ALL_CONTENT,
  R.style.BrandedPlaceDetailsTheme,
)