Temel Yer Adı Otomatik Tamamlama bileşeni

Places UI Kit'in Basic Yer Adı Otomatik Tamamlama bileşeni, kullanıcı bir yer seçtiğinde yer kimliği döndüren ayrı bir kullanıcı arayüzü bileşeni eklemenize olanak tanır. Bileşen, kullanıcıların sorgu girebileceği bir arama çubuğu sağlayan tam ekran bir kapaktır. Kullanıcı yazarken arama çubuğunun altında otomatik tamamlama sonuçlarının bir listesi gösterilir. Kullanıcı bir yere dokunduğunda, geliştiriciye yalnızca yer kimliği içeren bir yer nesnesi döndürülür. Bu bileşen özelleştirilebilir.

Temel Yer Adı Otomatik Tamamlama bileşeninde şu özelleştirme seçenekleri bulunur: liste yoğunluğu ve konum simgelerinin eklenip eklenmeyeceği. Bileşeni özelleştirmek için AutocompleteUICustomization kullanın.

Basic Yer Adı Otomatik Tamamlama bileşenini bağımsız olarak veya diğer Google Haritalar Platformu API'leri ve hizmetleriyle birlikte kullanabilirsiniz.

Faturalandırma

Bileşen her açıldığında ve sorgu yapıldığında faturalandırılırsınız. Oturumun süresi dolmadığı veya listeden bir yer seçilmediği sürece bu oturum için tekrar faturalandırılmazsınız.

Uygulamanıza Basic Autocomplete bileşenini ekleme

Otomatik tamamlama filtresi parametrelerini (ör. döndürülecek türler, sonuçların sınırlandırılacağı ülke, sonuçların bölge koordinatları, varsa mesafe bilgilerini görüntüleme isteğinin kaynağı) Places UI Kit olmadan Yer Adı Otomatik Tamamlama (Yeni) özelliğini kullanacak şekilde ayarlayın. Tüm talimatlar ve otomatik tamamlama filtresi oluşturma kodunun bir örneği için Yer Adı Otomatik Tamamlama (Yeni) belgelerine bakın.

Otomatik tamamlama filtrenizi oluşturduktan sonra kullanıcı arayüzü özelleştirmelerinizi ekleyin. Özelleştirme seçeneklerini ve talimatlarını inceleyin.

Kotlin

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

Örneğin tamamını inceleyin.

Basic Autocomplete bileşenini özelleştirme

İçeriği özelleştirme

Liste yoğunluğu

İki satırlı veya çok satırlı bir liste görüntülemeyi seçebilirsiniz. AutocompleteUICustomization sınıfındaki AutocompleteListDensity (TWO_LINE veya MULTI_LINE) seçeneklerini kullanın. Liste yoğunluğunu belirtmezseniz bileşen iki satırlı bir liste gösterir.

Konum simgesi

Sonuç listesinde varsayılan bir yer simgesi gösterilip gösterilmeyeceğini seçebilirsiniz. AutocompleteUICustomization sınıfındaki AutocompleteUIIcon (listItemDefaultIcon veya noIcon) seçeneklerini kullanın.

Temayı özelleştirme

Varsayılan stil özelliklerinden herhangi birini geçersiz kılan bir tema belirtebilirsiniz. Yer Ayrıntıları bileşeninizin renklerini, tipografisini, boşluklarını, kenarlıklarını ve köşelerini özelleştirebilirsiniz. Varsayılan değer: PlacesMaterialTheme.

Geçersiz kılınmayan tema özellikleri, varsayılan stilleri kullanır.

Places UI Kit varsayılan olarak koyu tema sağlar. Bu nedenle hem koyu hem de açık temaları özelleştirmeniz gerekebilir. Koyu temayı özelleştirmek için values-night/colors.xml dosyasına renk için bir giriş ekleyin.

Tema oluşturma hakkında daha fazla bilgi için Özel stil bölümüne bakın.

Temel Otomatik Tamamlama bileşenine içerik ve tema özelleştirmeleri ekleme

Temel Otomatik Tamamlama bileşenini özelleştirmek için AutocompleteUICustomization sınıfını kullanın.

Kotlin

.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()
)

Örnek

Özel bir Basic Autocomplete bileşeni ekleyin.

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

Temayı özelleştirme

Places UI Kit varsayılan olarak koyu tema sağlar. Bu nedenle hem koyu hem de açık temaları özelleştirmeniz gerekebilir. Koyu temayı özelleştirmek için values-night/colors.xml dosyasına renk için bir giriş ekleyin.

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