Kit de IU de Places Details (experimental)

Vista compacta de los detalles del lugar

El kit de IU de Place Details te permite agregar un componente de IU individual que muestre los detalles de los lugares en tu app. El kit de IU se puede usar de forma independiente o en conjunto con otras APIs y servicios de Google Maps Platform. El kit de la IU toma un ID de lugar o coordenadas de latitud y longitud, y muestra la información renderizada de Place Details.

El kit de IU ofrece una vista compacta, que se puede mostrar horizontal o verticalmente. Para personalizar la apariencia de los detalles del lugar, anula cualquiera de los atributos del tema predeterminado. También puedes personalizar qué campos de detalles del lugar se incluyen especificando una lista de entradas Content, cada una de las cuales corresponde a un dato que se muestra sobre el lugar.

Facturación

Cuando usas el kit de IU de Place Details, se te factura por cada lugar que se carga con el widget. Si cargas el mismo lugar varias veces, se te facturará por cada solicitud.

Habilita el kit de IU de Places

Antes de usar el kit de IU de Places, debes hacer lo siguiente:

Ejemplos del kit de IU de Place Details

Para agregar detalles de lugares a tu app, agrega un fragmento a un diseño. Cuando creas una instancia del fragmento, puedes personalizar el aspecto de la información de los detalles del lugar para que se adapte a tus necesidades y coincida con el aspecto de tu app.

Puedes especificar la orientación (horizontal o vertical), las anulaciones de temas y el contenido. Las opciones de contenido son medios, dirección, calificación, precio, tipo, entrada accesible, vínculo a Maps y vínculo a instrucciones sobre cómo llegar. [Ver un ejemplo de personalización]().

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

Ejemplo de personalización

Cuando creas una instancia de un fragmento, puedes especificar un tema que anule cualquiera de los atributos de estilo predeterminados. Los atributos de tema que no se anulen usarán los estilos predeterminados. Si deseas admitir un tema oscuro, puedes agregar una entrada para el color en 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>

Puedes personalizar los siguientes estilos:

  • placesColorSurfaceContainerLowest
  • placesColorOutlineDecorative
  • placesColorPrimary
  • placesColorOnSurface
  • placesColorOnSurfaceVariant
  • placesColorSecondaryContainer
  • placesColorOnSecondaryContainer
  • placesCornerRadius
  • placesTextAppearanceBodySmall
  • placesTextAppearanceBodyMedium
  • placesTextAppearanceBodyLarge
  • placesTextAppearanceLabelLarge
  • placesTextAppearanceHeadlineMedium
  • placesColorAttributionLight (enumeraciones para blanco, gris y negro)
  • placesColorAttributionDark (enumeraciones para blanco, gris y negro)

En este ejemplo, se personaliza el contenido estándar.

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

En este ejemplo, se personaliza todo el contenido.

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