Перейти к основному содержимому

Виджет выбора места

Виджет PlacePicker предназначен для получения информации о местах, таких как учреждения (например, здания, парки, музеи) и географические объекты (например, дороги, озера, горы). Он предоставляет детали, такие как название, адрес, город, штат, страна, почтовый индекс и координаты широты и долготы.

Этот виджет особенно полезен в приложениях, например, услугах заказа такси. Например, его можно использовать для захвата точного местоположения и полного адреса места назначения, отображая эту информацию на странице или интегрируя ее на карту Google.

Визуально виджет PlacePicker выглядит как кнопка. При нажатии на неё открывается возможность поиска места по его названию и отображения выпадающего списка совпадающих мест. После выбора места его название отображается на кнопке, а дополнительные детали можно получить через переменную placePickerValue из состояния виджета.

Вот пример из демонстрационного приложения:

Предварительные требования
  • Убедитесь, что вы включили API Мест в консоли Cloud. Ознакомьтесь с документацией по настройке.
  • Включите Биллинг на платформе Google Maps через консоль Cloud. Пожалуйста, обратите внимание: отсутствие включенного биллинга на платформе Google Maps приведет к отсутствию отображения мест в списке автозаполнения.
  • Добавьте API-ключи, как предложено в Руководстве по началу работы.

Добавление виджета выбора места

Чтобы добавить виджет PlacePicker в ваш проект:

По умолчанию виджет Place Picker представляет собой значок и текст "Выбрать местоположение" на кнопке. Вы можете изменить стиль и свойства этих элементов из панели свойств справа.

Если оставить виджет Text, текст будет обновляться на название выбранного места, когда пользователь делает выбор. Оба элемента (значок и текст) являются необязательными; настройте их в соответствии с требованиями вашего дизайна.

place-picker-properties.png

Свойства виджета виджета выбора места

Использование значений состояния виджета PlacePicker

Значения, связанные с выбранным местом, хранятся в пользовательском типе данных GooglePlace, предоставленном FlutterFlow. Он содержит поля, такие как Название выбранного места, Адрес, LatLng, Город, Штат, Страна и Почтовый индекс. Пользователи могут использовать эти значения в любом виджете, либо непосредственно устанавливать их в виджете Text, либо для дальнейших условных расчетов.

Давайте протестируем это изменение в режиме тестирования: