Google uses AI technology to translate content into your preferred language. AI translations can contain errors.

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

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

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

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

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

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

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

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

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

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

เมื่อต้องการให้แอปโหลดผลการค้นหาด้วยข้อความหรือผลการค้นหาสถานที่ใกล้เคียง ให้เรียก 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: ขนาดรูปภาพในการวางแนวตั้งของ Fragment ค่าเริ่มต้นคือ SMALL
preferTruncation: จะตัดข้อความของมุมมองรายละเอียดสถานที่แต่ละรายการหรือไม่
attributionPosition: จะแสดงการแสดงที่มาของภาพ Google Maps ที่ด้านบนหรือด้านล่างของคอมโพเนนต์หรือไม่
selectable: จะเลือกสถานที่แต่ละแห่งในรายการได้หรือไม่

เพิ่มการกำหนดค่าการปรับแต่งลงใน 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>