Komponen Place Autocomplete dasar

Komponen Place Autocomplete Dasar dari Places UI Kit memungkinkan Anda menambahkan komponen UI individual yang menampilkan ID tempat saat pengguna memilih tempat. Komponen ini adalah penutup layar penuh yang menyediakan kotak penelusuran bagi pengguna untuk memasukkan kueri. Saat pengguna mengetik, daftar hasil pelengkapan otomatis akan ditampilkan di bawah kotak penelusuran. Saat pengguna mengetuk suatu tempat, objek tempat dengan hanya ID tempat akan ditampilkan kepada developer. Komponen ini dapat disesuaikan.

Komponen Place Autocomplete Dasar memiliki opsi penyesuaian berikut: kepadatan daftar, dan apakah akan menyertakan ikon lokasi. Gunakan AutocompleteUICustomization untuk menyesuaikan komponen.

Anda dapat menggunakan komponen Place Autocomplete Dasar secara terpisah atau bersama dengan API dan layanan Google Maps Platform lainnya.

Penagihan

Anda akan ditagih setiap kali komponen dibuka dan kueri dibuat. Anda tidak akan ditagih lagi untuk sesi tersebut kecuali jika sesi berakhir atau tempat dipilih dari daftar.

Menambahkan komponen Basic Autocomplete ke aplikasi Anda

Tetapkan parameter filter pelengkapan otomatis (misalnya, jenis yang akan ditampilkan, negara yang akan membatasi hasil, koordinat wilayah untuk hasil, asal permintaan untuk menampilkan informasi jarak, jika tersedia) seperti yang akan Anda lakukan untuk menggunakan Place Autocomplete (Baru) tanpa Places UI Kit. Lihat dokumentasi Place Autocomplete (Baru) untuk mengetahui petunjuk lengkap dan contoh kode untuk membuat filter pelengkapan otomatis.

Setelah membuat filter pelengkapan otomatis, tambahkan penyesuaian UI. Lihat opsi dan petunjuk penyesuaian.

Kotlin

AutocompleteUiCustomization.create(
  listDensity = AutocompleteListDensity.MULTI_LINE,
  listItemIcon = AutocompleteUiIcon.noIcon(),
)

Java

      
AutocompleteUiCustomization.builder()
  .listItemIcon(AutocompleteUiIcon.noIcon())
  .listDensity(AutocompleteListDensity.MULTI_LINE)
  .build()

Lihat contoh lengkapnya.

Menyesuaikan komponen Pelengkapan Otomatis Dasar

Kepadatan daftar

Anda dapat memilih untuk menampilkan daftar dua baris atau daftar multiline. Gunakan opsi di AutocompleteListDensity (TWO_LINE atau MULTI_LINE) di class AutocompleteUICustomization. Jika Anda tidak menentukan kepadatan daftar, komponen akan menampilkan daftar dua baris.

Ikon lokasi

Anda dapat memilih apakah akan menampilkan ikon tempat default di daftar hasil. Gunakan opsi di AutocompleteUIIcon (listItemDefaultIcon atau noIcon) di class AutocompleteUICustomization.

Menambahkan penyesuaian ke komponen Pelengkapan Otomatis Dasar

Gunakan class AutocompleteUICustomization untuk menyesuaikan komponen Pelengkapan Otomatis Dasar.

Kotlin

.setAutocompleteUiCustomization(
    AutocompleteUiCustomization.create(
      listDensity = AutocompleteListDensity.MULTI_LINE,
      listItemIcon = AutocompleteUiIcon.noIcon(),
    )
)

Java

.setAutocompleteUiCustomization(
  AutocompleteUiCustomization.builder()
    .listItemIcon(AutocompleteUiIcon.noIcon())
    .listDensity(AutocompleteListDensity.MULTI_LINE)
    .build()
)

Contoh

Contoh ini membuat komponen Basic Autocomplete kustom.

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