Выберите платформу: Android iOS JavaScript

Компонент поиска мест

Компонент Place Search из Places UI Kit отображает результаты поиска мест в виде списка.

Компонент поиска мест Places UI Kit

Вы можете настроить список поиска мест. Вы можете указать:

  • Контент, который нужно показать.
  • Размер медиаконтента при вертикальной ориентации
  • Сокращение текста
  • Ориентация
  • переопределения тем, соответствующие бренду и системе дизайна приложения;
  • Позиция атрибуции
  • Можно ли выбрать место.

Вы также можете настроить запрос на выполнение SearchByTextRequest или SearchNearbyRequest.

Оплата

С вас будет взиматься плата каждый раз, когда изменяется значение привязки configureFromSearchByTextRequest() или configureFromSearchNearbyRequest().

Как добавить в приложение поиск мест

Чтобы использовать виджет поиска мест, добавьте в макет PlaceSearchFragment фрагмент.

Чтобы загрузить в приложение результаты текстового поиска или поиска поблизости, вызовите метод configureFromSearchByTextRequest() или configureFromSearchNearbyRequest() с запросом.

Kotlin

fragment.configureFromSearchByTextRequest(searchByTextRequest)

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

Java

fragment.configureFromSearchByTextRequest(searchByTextRequest)

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

Вы также можете добавить необязательный параметр PlaceSearchFragmentListener в компонент, чтобы получать обратные вызовы при загрузке компонента, выборе места (если оно доступно для выбора) или при ошибке загрузки компонента.

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) {...}
  }
)

Как настроить компонент поиска мест

Как настроить контент

Вам нужно указать, какой контент будет отображаться в компоненте.

В этом примере компонент настроен так, чтобы показывать адрес и рейтинг места.

Kotlin

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

Java

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

Вы также можете настроить следующие аспекты контента, который появляется в компоненте "Поиск мест":

  • PlaceSearchFragment.Content – контент, который показывается в компоненте.
  • mediaSize – размер фотографии в вертикальной ориентации фрагмента. Значение по умолчанию – SMALL.
  • preferTruncation – нужно ли обрезать текст в каждом представлении информации о местах.
  • attributionPosition – нужно ли показывать атрибуцию Google Карт вверху или внизу компонента.
  • selectable – можно ли выбрать каждый объект в списке.

Добавьте конфигурацию персонализации в файл 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)

Как настроить ориентацию

По умолчанию для скринкаста выбирается вертикальная ориентация. Для горизонтальной ориентации укажите Orientation.HORIZONTAL в PlaceSearchFragment.newInstance().

Kotlin

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

Java

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

Как настроить тему

При создании фрагмента можно указать тему, которая переопределит любые атрибуты стиля по умолчанию. Вы можете настроить цвета, типографику, интервалы, границы и углы компонента "Информация о месте". Значение по умолчанию – PlacesMaterialTheme.

Для атрибутов темы, которые не были переопределены, используются стили по умолчанию.

По умолчанию в Places UI Kit используется тёмная тема, поэтому вам может понадобиться настроить как тёмную, так и светлую тему. Чтобы настроить темную тему, добавьте запись для цвета в values-night/colors.xml.

Подробнее о собственных стилях…

Примеры

Как создать экземпляр компонента "Поиск мест"

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)

Как настроить тему

По умолчанию в Places UI Kit используется тёмная тема, поэтому вам может понадобиться настроить как тёмную, так и светлую тему. Чтобы настроить темную тему, добавьте запись для цвета в 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>