UI Kit informacji o miejscach (funkcja eksperymentalna)

Zestaw interfejsu użytkownika z informacjami o miejscach umożliwia dodanie do aplikacji osobnego komponentu UI, który wyświetla informacje o miejscu. Zestaw interfejsu użytkownika może być używany samodzielnie lub w połączeniu z innymi interfejsami API i usługami platformy Mapy Google. Zestaw interfejsu użytkownika przyjmuje identyfikator miejsca lub współrzędne geograficzne i zwraca renderowane informacje Szczegóły miejsca.

Pakiet interfejsu użytkownika zawiera widok kompaktowy, który można wyświetlić w poziomie lub w pionie. Możesz dostosować wygląd informacji o miejscu, zastępując dowolny atrybut motywu domyślnego. Możesz też dostosować pola informacji o miejscu, które mają być uwzględnione, przez podanie listy elementów Content, z których każdy odpowiada jednemu elementowi informacji o miejscu.

Płatności

Gdy używasz pakietu interfejsu użytkownika Szczegóły miejsca, płacisz za każde miejsce wczytane za pomocą widżetu. Jeśli wczytasz to samo miejsce kilka razy, płacisz za każde żądanie.

Włączanie zestawu interfejsu użytkownika Miejsca

Zanim zaczniesz korzystać z interfejsu Places UI Kit, musisz:

• Utwórz projekt Cloud z kontem rozliczeniowym.
• Włącz interfejs Places API w projekcie.
• Pobierz klucz interfejsu API.

Przykłady interfejsu użytkownika dotyczącego informacji o miejscu

Szczegóły miejsca możesz dodać do aplikacji, dodając fragment do układu. Podczas tworzenia wystąpienia fragmentu możesz dostosować wygląd i wygląd informacji o miejscu, aby dopasować je do potrzeb i wyglądu aplikacji.

Możesz określić orientację (poziomą lub pionową), zastąpić motyw i wybrać zawartość. Opcje treści to media, adres, ocena, cena, typ, dostępny wejście, link do mapy i link do wskazówek dojazdu. [Zobacz przykład personalizacji]().

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

Przykład dostosowywania

Podczas tworzenia wystąpienia fragmentu możesz określić motyw, który zastąpi dowolne domyślne atrybuty stylu. Wszystkie atrybuty motywu, które nie zostały zastąpione, używają domyślnych stylów. Jeśli chcesz obsługiwać tryb ciemny, możesz dodać wpis koloru w pliku 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>

Możesz dostosować te style:

• placesColorSurfaceContainerLowest
• placesColorOutlineDecorative
• placesColorPrimary
• placesColorOnSurface
• placesColorOnSurfaceVariant
• placesColorSecondaryContainer
• placesColorOnSecondaryContainer
• placesCornerRadius
• placesTextAppearanceBodySmall
• placesTextAppearanceBodyMedium
• placesTextAppearanceBodyLarge
• placesTextAppearanceLabelLarge
• placesTextAppearanceHeadlineMedium
• placesColorAttributionLight (enums for white, gray, and black)
• placesColorAttributionDark (enums for white, gray, and black)

Ten przykład dostosowuje standardową treść.

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

Ta próbka dostosowuje wszystkie treści.

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