Wybierz platformę: Android iOS JavaScript

Komponent Wyszukiwanie miejsc

Komponent Wyszukiwanie miejsc w ramach interfejsu Places UI Kit renderuje wyniki wyszukiwania miejsca w postaci listy.

Komponent Wyszukiwanie miejsc w interfejsie Places UI Kit

Możesz dostosować listę wyszukiwania miejsc. Możesz określić:

  • treści do wyświetlenia,
  • Rozmiar nośnika w orientacji pionowej
  • Obcinanie tekstu
  • Orientacja
  • Zastąpienia motywu, które pasują do marki i języka projektowania aplikacji.
  • Pozycja atrybucji
  • Czy miejsce można wybrać

Możesz też dostosować żądanie, aby wykonać SearchByTextRequest lub SearchNearbyRequest.

Płatności

Opłata jest naliczana za każdym razem, gdy zmieni się wartość powiązania configureFromSearchByTextRequest() lub configureFromSearchNearbyRequest().

Dodawanie do aplikacji wyszukiwania miejsc

Użyj widżetu wyszukiwania miejsc, dodając do układu PlaceSearchFragment fragment.

Jeśli chcesz, aby aplikacja wczytała wyniki wyszukiwania tekstowego lub wyszukiwania w pobliżu, wywołaj funkcję configureFromSearchByTextRequest() lub configureFromSearchNearbyRequest() z odpowiednim żądaniem.

Kotlin

fragment.configureFromSearchByTextRequest(searchByTextRequest)

// or fragment.configureFromSearchNearbyRequest(searchNearbyRequest) for nearby search

Java

fragment.configureFromSearchByTextRequest(searchByTextRequest)

// or fragment.configureFromSearchNearbyRequest(searchNearbyRequest) for nearby search

Możesz też dodać do komponentu opcjonalny element PlaceSearchFragmentListener, aby otrzymywać wywołania zwrotne, gdy komponent się wczyta, gdy zostanie wybrane miejsce (jeśli komponent ma być wybieralny) lub gdy wystąpi błąd wczytywania komponentu.

Kotlin

fragment.registerListener(
  object : PlaceSearchFragmentListener {
    override fun onLoad(places: List<Place>) {...}
    override fun onRequestError(e: Exception) {...}
    override fun onPlaceSelected(place: Place) {...}
  }
)

Java

fragment.registerListener(
  new PlaceSearchFragmentListener() {
    @Override public void onLoad(List<? extends Place> places) {...}
    @Override public void onRequestError(Exception e) {...}
    @Override public void onPlaceSelected(Place place) {...}
  }
)

Dostosowywanie komponentu Wyszukiwanie miejsc

Dostosowywanie treści

Musisz określić, jakie treści będzie wyświetlać komponent.

W tym przykładzie komponent jest skonfigurowany tak, aby wyświetlać adres i ocenę miejsca.

Kotlin

val fragment = PlaceSearchFragment.newInstance(listOf(Content.ADDRESS, Content.RATING))

Java

PlaceSearchFragment fragment = PlaceSearchFragment.newInstance(listOf(Content.ADDRESS,Content.RATING));

Możesz też opcjonalnie dostosować te aspekty treści wyświetlanych w komponencie wyszukiwania miejsca:

  • PlaceSearchFragment.Content: treść wyświetlana w komponencie.
  • mediaSize: rozmiar zdjęcia w orientacji pionowej fragmentu. Wartość domyślna to SMALL.
  • preferTruncation: czy tekst w każdym widoku szczegółów miejsca ma być obcięty.
  • attributionPosition: określa, czy atrybucja Map Google ma się wyświetlać u góry czy u dołu komponentu.
  • selectable: czy każde miejsce na liście można wybrać.

Dodaj konfigurację dostosowywania do pliku PlaceSearchFragment.

Kotlin

fragment.preferTruncation = false
fragment.attributionPosition = AttributionPosition.BOTTOM
fragment.mediaSize = MediaSize.SMALL
fragment.selectable = true

Java

fragment.setPreferTruncation(false)
fragment.setAttributionPosition(AttributionPosition.BOTTOM)
fragment.setMediaSize(MediaSize.SMALL)
fragment.setSelectable(true)

Dostosowywanie orientacji

Domyślna orientacja to pionowa. W przypadku orientacji poziomej w polu PlaceSearchFragment.newInstance() wpisz Orientation.HORIZONTAL.

Kotlin

PlaceSearchFragment.newInstance(
    PlaceSearchFragment.ALL_CONTENT,
    Orientation.HORIZONTAL
)

Java

PlaceSearchFragment.newInstance(
    PlaceSearchFragment.ALL_CONTENT,
    Orientation.HORIZONTAL
)

Dostosowywanie motywu

Podczas tworzenia instancji fragmentu możesz określić motyw, który zastąpi dowolne domyślne atrybuty stylu. Możesz dostosować kolory, typografię, odstępy, obramowania i rogi komponentu Szczegóły miejsca. Wartość domyślna to PlacesMaterialTheme.

Wszystkie atrybuty motywu, które nie zostały zastąpione, używają stylów domyślnych.

Zestaw interfejsu Miejsc domyślnie zawiera ciemny motyw, więc może być konieczne dostosowanie zarówno ciemnego, jak i jasnego motywu. Aby dostosować ciemny motyw, dodaj wpis koloru w values-night/colors.xml.

Więcej informacji o motywach znajdziesz w sekcji Niestandardowe style.

Przykłady

Utwórz instancję komponentu Wyszukiwanie miejsc

Kotlin

val fragment: PlaceSearchFragment =
PlaceSearchFragment.newInstance(PlaceSearchFragment.STANDARD_CONTENT)

fragment.preferTruncation = false
fragment.attributionPosition = AttributionPosition.BOTTOM
fragment.mediaSize = MediaSize.SMALL
fragment.selectable = true

fragment.registerListener(
  object : PlaceSearchFragmentListener {
    override fun onLoad(places: List<Place>) {...}
    override fun onRequestError(e: Exception) {...}
    override fun onPlaceSelected(place: Place) {...}
  }
)

supportFragmentManager
  .beginTransaction()
  .replace(R.id.fragment_container, fragment)
  .commitNow()

fragment.configureFromSearchByTextRequest(searchByTextRequest)

Java

PlaceSearchFragment fragment = PlaceSearchFragment.newInstance(PlaceSearchFragment.STANDARD_CONTENT);

fragment.setPreferTruncation(false)
fragment.setAttributionPosition(AttributionPosition.BOTTOM)
fragment.setMediaSize(MediaSize.SMALL)
fragment.setSelectable(true)

fragment.registerListener(
  new PlaceSearchFragmentListener() {
      @Override public void onLoad(List<? extends Place> places) {...}
      @Override public void onRequestError(Exception e) {...}
      @Override public void onPlaceSelected(Place place) {...}
  }
)

getSupportFragmentManager()
  .beginTransaction()
  .replace(R.id.fragment_container, fragment)
  .commitNow();

fragment.configureFromSearchByTextRequest(searchByTextRequest)

Dostosowywanie motywu

Zestaw interfejsu Miejsc domyślnie zawiera ciemny motyw, więc może być konieczne dostosowanie zarówno ciemnego, jak i jasnego motywu. Aby dostosować ciemny motyw, dodaj wpis koloru w values-night/colors.xml. 

 <style name="CustomizedTheme" parent="PlacesMaterialTheme">
    <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>