Компонент автозаполнения Basic Place

Компонент Basic Place Autocomplete из Places UI Kit позволяет добавить отдельный компонент пользовательского интерфейса, который возвращает ID места , когда пользователь выбирает место. Компонент представляет собой полноэкранное окно, отображающее строку поиска, в которую пользователи могут вводить запрос. По мере ввода пользователем текста под строкой поиска будет отображаться список результатов автозаполнения. При нажатии на место разработчику возвращается объект Place, содержащий только ID места. Этот компонент настраиваемый.

Компонент Basic Place Autocomplete имеет следующие параметры настройки: плотность списка и включение значков местоположения. Используйте AutocompleteUICustomization для настройки компонента.

Компонент Basic Place Autocomplete можно использовать как самостоятельно, так и в сочетании с другими API и сервисами платформы Google Maps.

Выставление счетов

С вас взимается плата каждый раз, когда компонент открывается и выполняется запрос. Повторная оплата за эту сессию взиматься не будет, если сессия не истечет или не будет выбрано место из списка.

Добавьте компонент «Базовое автозаполнение» в ваше приложение.

Настройте параметры фильтра автозаполнения (например, типы возвращаемых результатов, страну, по которой следует ограничить результаты, координаты региона для результатов, источник запроса для отображения информации о расстоянии, если таковая имеется) так же, как и при использовании функции автозаполнения мест (новая версия) без Places UI Kit. Полные инструкции и пример кода для создания фильтра автозаполнения см. в документации по функции автозаполнения мест (новая версия).

После создания фильтра автозаполнения добавьте параметры настройки пользовательского интерфейса. См. параметры настройки и инструкции.

Котлин

AutocompleteUiCustomization.create(
  listDensity = AutocompleteListDensity.MULTI_LINE,
  listItemIcon = AutocompleteUiIcon.noIcon(),
  theme = R.style.CustomizedTheme,
)

Java

      
AutocompleteUiCustomization.builder()
  .listItemIcon(AutocompleteUiIcon.noIcon())
  .listDensity(AutocompleteListDensity.MULTI_LINE)
  .theme(R.style.CustomizedTheme)
  .build()

См. полный пример .

Настройка базового компонента автозаполнения

Настройте контент

Плотность списка

Вы можете выбрать отображение списка AutocompleteUICustomization AutocompleteListDensity TWO_LINE или MULTI_LINE ). Если вы не укажете плотность списка, компонент отобразит список в две строки.

Значок местоположения

Вы можете выбрать, отображать ли значок места по умолчанию в списке результатов. Используйте параметры класса AutocompleteUIIcon ( listItemDefaultIcon или noIcon ) в классе AutocompleteUICustomization .

Настройте тему

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

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

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

Более подробную информацию о настройке тем оформления см. в разделе «Настройка стиля» .

Добавьте в компонент «Базовое автозаполнение» настройки контента и темы оформления.

Используйте класс AutocompleteUICustomization для настройки компонента Basic Autocomplete.

Котлин

.setAutocompleteUiCustomization(
    AutocompleteUiCustomization.create(
      listDensity = AutocompleteListDensity.MULTI_LINE,
      listItemIcon = AutocompleteUiIcon.noIcon(),
      theme = R.style.CustomizedTheme,
    )
)

Java

.setAutocompleteUiCustomization(
  AutocompleteUiCustomization.builder()
    .listItemIcon(AutocompleteUiIcon.noIcon())
    .listDensity(AutocompleteListDensity.MULTI_LINE)
    .theme(R.style.CustomizedTheme)
    .build()
)

Пример

Добавьте пользовательский компонент «Базовое автозаполнение».

Котлин

  val basicPlaceAutocompleteActivityResultLauncher:
  ActivityResultLauncher<Intent> =
    registerForActivityResult(ActivityResultContracts.StartActivityForResult()) {
      result: ActivityResult ->
        val intent = result.data
        val place: Place? = BasicPlaceAutocomplete.getPlaceFromIntent(intent!!)
        val status: Status? =  
          BasicPlaceAutocomplete.getResultStatusFromIntent(intent!!)
        // ...
      }
  
  val autocompleteIntent: Intent =
    BasicPlaceAutocomplete.createIntent(this) {
      setInitialQuery("INSERT_QUERY_TEXT")
      setOrigin(LatLng(10.0, 10.0))
      // ...
  
      setAutocompleteUiCustomization(
        AutocompleteUiCustomization.create(
          listDensity = AutocompleteListDensity.MULTI_LINE,
          listItemIcon = AutocompleteUiIcon.noIcon(),
          theme = R.style.CustomizedTheme,
        )
      )
    }
  
  basicPlaceAutocompleteActivityResultLauncher.launch(autocompleteIntent)

Java

  ActivityResultLauncher<Intent> basicPlaceAutocompleteActivityResultLauncher =
    registerForActivityResult(
      new ActivityResultContracts.StartActivityForResult(),
      new ActivityResultCallback<ActivityResult>() {
        @Override
        public void onActivityResult(ActivityResult result) {
          Intent intent = result.getData();
          if (intent != null) {
            Place place =
              BasicPlaceAutocomplete.getPlaceFromIntent(intent);
            Status status =
              BasicPlaceAutocomplete.getResultStatusFromIntent(intent);
            //...
          }
        }
      }
    );
  
  Intent basicPlaceAutocompleteIntent =
    new BasicPlaceAutocomplete.IntentBuilder()
      .setInitialQuery("INSERT_QUERY_TEXT")
      .setOrigin(new LatLng(10.0, 10.0))
      //...
  
      .setAutocompleteUiCustomization(
        AutocompleteUiCustomization.builder()
          .listItemIcon(AutocompleteUiIcon.noIcon())
          .listDensity(AutocompleteListDensity.MULTI_LINE)
          .theme(R.style.CustomizedTheme)
          .build())
    .build(this);
  
  basicPlaceAutocompleteActivityResultLauncher.launch(basicPlaceAutocompleteIntent);

Настройте тему

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