基本 Place Autocomplete 元件
Places UI Kit 的 Basic Place Autocomplete 元件可讓您新增個別 UI 元件,在使用者選取地點時傳回地點 ID。這個元件是全螢幕的封面,提供搜尋列供使用者輸入查詢。使用者輸入內容時,搜尋列下方會顯示自動完成結果清單。使用者輕觸地點時,系統只會將地點 ID 傳回給開發人員。這個元件可自訂。
Basic Place Autocomplete 元件提供下列自訂選項:清單密度,以及是否要加入位置圖示。使用 AutocompleteUICustomization
自訂元件。
您可以單獨使用基本地點自動完成元件,也可以搭配其他 Google Maps Platform API 和服務使用。
帳單
每次開啟元件並提出查詢時,系統都會向您收費。除非工作階段過期或從清單中選取地點,否則系統不會再次向你收費。
在應用程式中加入 Basic Autocomplete 元件
設定自動完成篩選器參數 (例如要傳回的類型、要限制結果的國家/地區、結果的區域座標、要求來源 (如適用) 來顯示距離資訊),就像使用 Place Autocomplete (新版) 時一樣,但不需要 Places UI Kit。如需完整操作說明和建立自動完成篩選器的程式碼範例,請參閱 Place Autocomplete (New) 說明文件。
建立自動完成篩選器後,請新增 UI 自訂項目。查看自訂選項和操作說明。
Kotlin
AutocompleteUiCustomization.create( listDensity = AutocompleteListDensity.MULTI_LINE, listItemIcon = AutocompleteUiIcon.noIcon(), )
Java
AutocompleteUiCustomization.builder() .listItemIcon(AutocompleteUiIcon.noIcon()) .listDensity(AutocompleteListDensity.MULTI_LINE) .build()
自訂基本自動完成元件
清單密度
您可以選擇顯示兩行清單或多行清單。在 AutocompleteUICustomization
類別中,使用 AutocompleteListDensity
(TWO_LINE
或 MULTI_LINE
) 中的選項。如未指定清單密度,元件會顯示兩行清單。
位置圖示
您可以選擇是否要在結果清單中顯示預設地點圖示。在 AutocompleteUICustomization
類別中使用 AutocompleteUIIcon
中的選項 (listItemDefaultIcon
或 noIcon
)。
在基本自動完成元件中新增自訂項目
使用 AutocompleteUICustomization
類別自訂基本自動完成元件。
Kotlin
.setAutocompleteUiCustomization( AutocompleteUiCustomization.create( listDensity = AutocompleteListDensity.MULTI_LINE, listItemIcon = AutocompleteUiIcon.noIcon(), ) )
Java
.setAutocompleteUiCustomization( AutocompleteUiCustomization.builder() .listItemIcon(AutocompleteUiIcon.noIcon()) .listDensity(AutocompleteListDensity.MULTI_LINE) .build() )
範例
這個範例會建立自訂的「基本自動完成」元件。
Kotlin
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(), ) ) } 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) .build()) .build(this); basicPlaceAutocompleteActivityResultLauncher.launch(basicPlaceAutocompleteIntent);