Google ใช้เทคโนโลยี AI เพื่อแปลเนื้อหาเป็นภาษาที่คุณต้องการ การแปลโดย AI อาจมีข้อผิดพลาด

เลือกแพลตฟอร์ม: Android iOS JavaScript

คอมโพเนนต์การค้นหาสถานที่

คอมโพเนนต์การค้นหาสถานที่ของ Places UI Kit จะแสดงผลการค้นหาสถานที่ในรายการ

คุณปรับแต่งรายการการค้นหาสถานที่ได้ คุณสามารถระบุสิ่งต่อไปนี้ได้

เนื้อหาที่จะแสดง
ขนาดสื่อในการวางแนวตั้ง
การตัดข้อความ
การวางแนว
การลบล้างธีมที่ตรงกับแบรนด์และภาษาออกแบบของแอป
ตำแหน่งของการระบุแหล่งที่มา
เลือกสถานที่ได้หรือไม่

นอกจากนี้ คุณยังปรับแต่งคำขอให้ดำเนินการ SearchByTextRequest หรือ SearchNearbyRequest ก็ได้

การเรียกเก็บเงิน

ระบบจะเรียกเก็บเงินจากคุณทุกครั้งที่มีการเปลี่ยนแปลงค่าการเชื่อมโยง configureFromSearchByTextRequest() หรือ configureFromSearchNearbyRequest()

เพิ่มการค้นหาสถานที่ลงในแอป

ใช้วิดเจ็ตการค้นหาสถานที่โดยเพิ่มPlaceSearchFragment ส่วนลงในเลย์เอาต์

เมื่อต้องการให้แอปโหลดผลการค้นหาข้อความหรือผลการค้นหาในบริเวณใกล้เคียง ให้เรียกใช้ configureFromSearchByTextRequest() หรือ configureFromSearchNearbyRequest() พร้อมคำขอ

Kotlin

fragment.configureFromSearchByTextRequest(searchByTextRequest)

// or fragment.configureFromSearchNearbyRequest(searchNearbyRequest) for nearby search

Java

fragment.configureFromSearchByTextRequest(searchByTextRequest)

// or fragment.configureFromSearchNearbyRequest(searchNearbyRequest) for nearby search

นอกจากนี้ คุณยังเพิ่ม PlaceSearchFragmentListener ที่ไม่บังคับลงในคอมโพเนนต์เพื่อรับการเรียกกลับเมื่อคอมโพเนนต์โหลด เลือกสถานที่ (หากตั้งค่าให้เลือกได้) หรือเมื่อเกิดข้อผิดพลาดในการโหลดคอมโพเนนต์ได้ด้วย

Kotlin

fragment.registerListener(
  object : PlaceSearchFragmentListener {
    override fun onLoad(places: List<Place>) {...}
    override fun onRequestError(e: Exception) {...}
    override fun onPlaceSelected(place: Place) {...}
  }
)

Java

fragment.registerListener(
  new PlaceSearchFragmentListener() {
    @Override public void onLoad(List<? extends Place> places) {...}
    @Override public void onRequestError(Exception e) {...}
    @Override public void onPlaceSelected(Place place) {...}
  }
)

ปรับแต่งคอมโพเนนต์การค้นหาสถานที่

ปรับแต่งเนื้อหา

คุณต้องระบุเนื้อหาที่คอมโพเนนต์จะแสดง

ตัวอย่างนี้กำหนดค่าคอมโพเนนต์ให้แสดงที่อยู่และคะแนนของสถานที่

Kotlin

val fragment = PlaceSearchFragment.newInstance(listOf(Content.ADDRESS, Content.RATING))

Java

PlaceSearchFragment fragment = PlaceSearchFragment.newInstance(listOf(Content.ADDRESS,Content.RATING));

นอกจากนี้ คุณยังปรับแต่งด้านต่อไปนี้ของเนื้อหาที่ปรากฏในคอมโพเนนต์การค้นหาสถานที่ได้ด้วย (ไม่บังคับ)

PlaceSearchFragment.Content: เนื้อหาที่แสดงในคอมโพเนนต์
mediaSize: ขนาดรูปภาพในการวางแนวตั้งของส่วน ค่าเริ่มต้นคือ SMALL
preferTruncation: จะตัดข้อความของมุมมองรายละเอียดสถานที่แต่ละรายการหรือไม่
attributionPosition: เลือกว่าจะแสดงการระบุแหล่งที่มาของ Google Maps ที่ด้านบนหรือด้านล่างของคอมโพเนนต์
เลือกได้: เลือกร้านค้าแต่ละแห่งในรายการได้หรือไม่

เพิ่มการกำหนดค่าการปรับแต่งลงใน PlaceSearchFragment

Kotlin

fragment.preferTruncation = false
fragment.attributionPosition = AttributionPosition.BOTTOM
fragment.mediaSize = MediaSize.SMALL
fragment.selectable = true

Java

fragment.setPreferTruncation(false)
fragment.setAttributionPosition(AttributionPosition.BOTTOM)
fragment.setMediaSize(MediaSize.SMALL)
fragment.setSelectable(true)

ปรับแต่งการวางแนว

การวางแนวเริ่มต้นคือแนวตั้ง สำหรับการวางแนวแนวนอน ให้ระบุ Orientation.HORIZONTAL ใน PlaceSearchFragment.newInstance()

Kotlin

PlaceSearchFragment.newInstance(
    PlaceSearchFragment.ALL_CONTENT,
    Orientation.HORIZONTAL
)

Java

PlaceSearchFragment.newInstance(
    PlaceSearchFragment.ALL_CONTENT,
    Orientation.HORIZONTAL
)

ปรับแต่งธีม

เมื่อสร้างอินสแตนซ์ของ Fragment คุณจะระบุธีมที่ลบล้างแอตทริบิวต์สไตล์เริ่มต้นได้ คุณสามารถปรับแต่งสี การพิมพ์ ระยะห่าง เส้นขอบ และมุมของคอมโพเนนต์รายละเอียดสถานที่ได้ โดยมีค่าเริ่มต้นเป็น PlacesMaterialTheme

แอตทริบิวต์ธีมที่ไม่ได้ลบล้างจะใช้รูปแบบเริ่มต้น

Places UI Kit มีธีมมืดเป็นค่าเริ่มต้น คุณจึงอาจต้องปรับแต่งทั้งธีมมืดและธีมสว่าง หากต้องการปรับแต่งธีมมืด ให้เพิ่มรายการสำหรับสีใน values-night/colors.xml

ดูข้อมูลเพิ่มเติมเกี่ยวกับการกำหนดธีมได้ที่ส่วนการจัดรูปแบบที่กำหนดเอง

ตัวอย่าง

สร้างอินสแตนซ์คอมโพเนนต์การค้นหาสถานที่

Kotlin

val fragment: PlaceSearchFragment =
PlaceSearchFragment.newInstance(PlaceSearchFragment.STANDARD_CONTENT)

fragment.preferTruncation = false
fragment.attributionPosition = AttributionPosition.BOTTOM
fragment.mediaSize = MediaSize.SMALL
fragment.selectable = true

fragment.registerListener(
  object : PlaceSearchFragmentListener {
    override fun onLoad(places: List<Place>) {...}
    override fun onRequestError(e: Exception) {...}
    override fun onPlaceSelected(place: Place) {...}
  }
)

supportFragmentManager
  .beginTransaction()
  .replace(R.id.fragment_container, fragment)
  .commitNow()

fragment.configureFromSearchByTextRequest(searchByTextRequest)

Java

PlaceSearchFragment fragment = PlaceSearchFragment.newInstance(PlaceSearchFragment.STANDARD_CONTENT);

fragment.setPreferTruncation(false)
fragment.setAttributionPosition(AttributionPosition.BOTTOM)
fragment.setMediaSize(MediaSize.SMALL)
fragment.setSelectable(true)

fragment.registerListener(
  new PlaceSearchFragmentListener() {
      @Override public void onLoad(List<? extends Place> places) {...}
      @Override public void onRequestError(Exception e) {...}
      @Override public void onPlaceSelected(Place place) {...}
  }
)

getSupportFragmentManager()
  .beginTransaction()
  .replace(R.id.fragment_container, fragment)
  .commitNow();

fragment.configureFromSearchByTextRequest(searchByTextRequest)

ปรับแต่งธีม

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