Kit de interface do Places Details (experimental)

Exibição compacta dos detalhes do lugar

Com o kit de interface para detalhes do lugar, você pode adicionar um componente de interface individual que mostra detalhes do lugar no seu app. O kit de interface pode ser usado de forma independente ou em conjunto com outras APIs e serviços da Plataforma Google Maps. O kit de interface usa um ID de lugar ou coordenadas de latitude/longitude e retorna informações renderizadas de Detalhes do lugar.

O kit de interface oferece uma visualização compacta, que pode ser exibida horizontal ou verticalmente. É possível personalizar a aparência dos detalhes do lugar substituindo qualquer um dos atributos do tema padrão. Também é possível personalizar quais campos de detalhes do lugar são incluídos especificando uma lista de entradas Content, cada uma correspondendo a uma informação mostrada sobre o lugar.

Faturamento

Ao usar o kit de interface do Place Details, você vai receber cobranças por cada lugar carregado usando o widget. Se você carregar o mesmo lugar várias vezes, haverá cobrança por cada solicitação.

Ativar o kit de interface do Places

Antes de usar o kit de interface do Places, você precisa:

Exemplos de kit de interface do Place Details

Para adicionar detalhes de lugar ao app, adicione um fragmento a um layout. Ao instanciar o fragmento, você pode personalizar a aparência das informações dos detalhes do lugar de acordo com suas necessidades e com a aparência do app.

É possível especificar a orientação (horizontal ou vertical), as substituições de tema e o conteúdo. As opções de conteúdo são mídia, endereço, classificação, preço, tipo, entrada acessível, link do Maps e link de direções. [Confira um exemplo de personalização]().

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

Exemplo de personalização

Ao instanciar um fragmento, é possível especificar um tema que substitui qualquer um dos atributos de estilo padrão. Todos os atributos de tema que não forem substituídos usam os estilos padrão. Se você quiser oferecer suporte a um tema escuro, adicione uma entrada para a cor em 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>

Você pode personalizar os seguintes estilos:

  • placesColorSurfaceContainerLowest
  • placesColorOutlineDecorative
  • placesColorPrimary
  • placesColorOnSurface
  • placesColorOnSurfaceVariant
  • placesColorSecondaryContainer
  • placesColorOnSecondaryContainer
  • placesCornerRadius
  • placesTextAppearanceBodySmall
  • placesTextAppearanceBodyMedium
  • placesTextAppearanceBodyLarge
  • placesTextAppearanceLabelLarge
  • placesTextAppearanceHeadlineMedium
  • placesColorAttributionLight (enums para branco, cinza e preto)
  • placesColorAttributionDark (enums para branco, cinza e preto)

Este exemplo personaliza o conteúdo padrão.

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

Este exemplo personaliza todo o conteúdo.

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