בחירת פלטפורמה: Android iOS JavaScript

רכיב בסיסי של השלמה אוטומטית למקומות

רכיב ההשלמה האוטומטית הבסיסי של המקומות בערכת כלי ה-UI של Places מאפשר להוסיף רכיב UI יחיד שמחזיר מזהה מקום כשמשתמש בוחר מקום. הרכיב הוא כיסוי מסך מלא שמספק סרגל חיפוש שבו המשתמשים יכולים להזין שאילתה. בזמן שהמשתמש מקליד, רשימה של תוצאות השלמה אוטומטית מוצגת מתחת לסרגל החיפוש. כשהמשתמש מקיש על מקום, מוחזר למפתח אובייקט של מקום עם מזהה המקום בלבד. אפשר להתאים אישית את הרכיב הזה.

לרכיב 'השלמה אוטומטית בסיסית של מקומות' יש את אפשרויות ההתאמה האישית הבאות: צפיפות הרשימה והאם לכלול סמלי מיקום. כדי להתאים אישית את הרכיב, משתמשים ב-AutocompleteUICustomization.

אפשר להשתמש ברכיב 'השלמה אוטומטית בסיסית של מקומות' באופן עצמאי או בשילוב עם ממשקי API ושירותים אחרים של Google Maps Platform.

חיוב

החיוב מתבצע בכל פעם שהרכיב נפתח ומתבצעת שאילתה. לא תחויבו שוב על הפעילות הזו אלא אם פג תוקף הפעילות או אם בחרתם מקום מהרשימה.

הוספת רכיב ההשלמה האוטומטית הבסיסי לאפליקציה

מגדירים את פרמטרי הסינון של ההשלמה האוטומטית (לדוגמה, הסוגים להחזרה, המדינה להגבלת התוצאות, קואורדינטות האזור לתוצאות, המקור של הבקשה להצגת פרטי המרחק, אם זמינים) כמו שמגדירים כשמשתמשים בהשלמה אוטומטית של מקומות (חדש) בלי ערכת כלי ה-UI של Places. הוראות מלאות ודוגמה לקוד ליצירת מסנן השלמה אוטומטית זמינות במסמכי התיעוד בנושא השלמה אוטומטית של מקומות (חדש).

אחרי שיוצרים את מסנן ההשלמה האוטומטית, מוסיפים את ההתאמות האישיות לממשק המשתמש. אפשרויות והוראות להתאמה אישית

Kotlin

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

Java

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

לדוגמה מלאה

התאמה אישית של רכיב ההשלמה האוטומטית הבסיסי

צפיפות הרשימה

אפשר לבחור להציג רשימה עם שתי שורות או רשימה עם כמה שורות. משתמשים באפשרויות ב-AutocompleteListDensity (TWO_LINE או MULTI_LINE) במחלקה AutocompleteUICustomization. אם לא מציינים את צפיפות הרשימה, הרכיב יציג רשימה של שתי שורות.

סמל המיקום

אתם יכולים לבחור אם להציג סמל ברירת מחדל של מקום ברשימת התוצאות. משתמשים באפשרויות ב-AutocompleteUIIcon (listItemDefaultIcon או noIcon) במחלקה AutocompleteUICustomization.

הוספת התאמות אישיות לרכיב 'השלמה אוטומטית בסיסית'

כדי להתאים אישית את רכיב ההשלמה האוטומטית הבסיסי, צריך להשתמש במחלקה 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);