เราขอแนะนำให้ใช้
SearchView
เป็นรายการในแถบแอปเพื่อให้ฟังก์ชันการค้นหาในแอป อาส
ที่มีรายการทั้งหมดในแถบแอป คุณสามารถกำหนด SearchView
ให้
แสดงตลอดเวลาหรือเฉพาะเมื่อมีพื้นที่ คุณยังสามารถกำหนดให้มิติข้อมูลนี้เป็น
การดำเนินการที่ยุบได้ ซึ่งจะแสดง SearchView
เป็นไอคอน
ในตอนแรกจะใช้แถบแอปทั้งแถบเป็นช่องค้นหาเมื่อผู้ใช้
ให้แตะไอคอน
เพิ่ม SearchView ลงในแถบแอป
หากต้องการเพิ่มวิดเจ็ต SearchView
ลงในแถบแอป ให้สร้างไฟล์ใน
โครงการชื่อ res/menu/options_menu.xml
และเพิ่มโค้ดต่อไปนี้
กับไฟล์ โค้ดนี้จะกำหนดวิธีสร้างรายการค้นหา เช่น ไอคอน
ที่จะใช้และชื่อของรายการ แอตทริบิวต์ collapseActionView
จะช่วยให้SearchView
ขยายครอบคลุมแถบแอปและ
ยุบกลับเข้าไปในรายการแถบแอปปกติเมื่อไม่ได้ใช้งาน เนื่องจาก
พื้นที่แถบแอปที่จำกัดในอุปกรณ์มือถือ เราขอแนะนำให้ใช้
แอตทริบิวต์ collapsibleActionView
เพื่อมอบให้กับผู้ใช้ที่ดีขึ้น
ประสบการณ์การใช้งาน
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/search" android:title="@string/search_title" android:icon="@drawable/ic_search" android:showAsAction="collapseActionView|ifRoom" android:actionViewClass="androidx.appcompat.widget.SearchView" /> </menu>
ถ้าคุณต้องการไอคอนค้นหา
ที่เข้าถึงได้ง่ายมากขึ้น
ic_search.xml
ไฟล์ในโฟลเดอร์ /res/drawable
และ
ใส่โค้ดต่อไปนี้ในรหัสผ่าน
<vector android:height="24dp" android:tint="#000000" android:viewportHeight="24" android:viewportWidth="24" android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android"> <path android:fillColor="@android:color/white" android:pathData="M15.5,14h-0.79l-0.28,-0.27C15.41,12.59 16,11.11 16,9.5 16,5.91 13.09,3 9.5,3S3,5.91 3,9.5 5.91,16 9.5,16c1.61,0 3.09,-0.59 4.23,-1.57l0.27,0.28v0.79l5,4.99L20.49,19l-4.99,-5zM9.5,14C7.01,14 5,11.99 5,9.5S7.01,5 9.5,5 14,7.01 14,9.5 11.99,14 9.5,14z"/> </vector>
หากต้องการแสดง SearchView
ในแถบแอป ให้เพิ่มเมนู XML ให้สูงเกินจริง
ทรัพยากร res/menu/options_menu.xml
ใน
onCreateOptionsMenu()
วิธีการทำกิจกรรมของคุณ
Kotlin
override fun onCreateOptionsMenu(menu: Menu): Boolean { menuInflater.inflate(R.menu.options_menu, menu) return true }
การเรียกใช้แอปจะสร้างข้อมูลต่อไปนี้
![รูปภาพแสดงหน้าจอว่างเปล่าพร้อมไอคอนค้นหาในแถบด้านบนของแอป](https://developer.android.com/static/images/ui/searchview_1.png?hl=th)
สัญลักษณ์ SearchView
ปรากฏในแถบแอปของแอป แต่ไม่ปรากฏ
ใช้งานได้จริง หากแตะไอคอนค้นหา คุณจะเห็นดังนี้
![รูปภาพแสดงมุมมองการค้นหาในการใช้งานจริง](https://developer.android.com/static/images/ui/searchview_2.png?hl=th)
SearchView
กำลังทำงาน
หากต้องการให้ SearchView
ทำงานได้ คุณต้องกำหนดวิธีที่ฟังก์ชัน
SearchView
ทำงาน
สร้างการกำหนดค่าการค้นหา
การค้นหา
การกำหนดค่าจะระบุลักษณะการทำงานของ SearchView
กำหนดไว้ในไฟล์ res/xml/searchable.xml
การกำหนดค่าการค้นหา
ต้องมีแอตทริบิวต์ android:label
อย่างน้อย 1 รายการที่มีแอตทริบิวต์
ค่าเดียวกับแอตทริบิวต์ android:label
ของ
<แอปพลิเคชัน>
หรือ <activity>
ในไฟล์ Manifest ของ Android อย่างไรก็ตาม เราขอแนะนำให้เพิ่ม
แอตทริบิวต์ android:hint
เพื่อให้ผู้ใช้ทราบว่าจะป้อนอะไร
ลงในช่องค้นหา
<?xml version="1.0" encoding="utf-8"?> <searchable xmlns:android="http://schemas.android.com/apk/res/android" android:label="@string/app_name" android:hint="@string/search_hint" />
ในไฟล์ Manifest ของแอป ให้ประกาศ
<meta-data>
ที่ชี้ไปยังไฟล์ res/xml/searchable.xml
ประกาศแอตทริบิวต์
ใน <activity>
ที่คุณต้องการแสดง
SearchView
<activity android:name=".SearchResultsActivity" android:exported="false" android:label="@string/title_activity_search_results" android:launchMode="singleTop" android:theme="@style/Theme.AppCompat.Light"> <intent-filter> <action android:name="android.intent.action.SEARCH" /> </intent-filter> <meta-data android:name="android.app.searchable" android:resource="@xml/searchable" /> </activity>
เชื่อมโยงในเมธอด onCreateOptionsMenu()
ที่คุณสร้าง
การกำหนดค่าการค้นหาด้วย SearchView
โดยการเรียก
setSearchableInfo(SearchableInfo)
:
Kotlin
override fun onCreateOptionsMenu(menu: Menu): Boolean { menuInflater.inflate(R.menu.options_menu, menu) val searchManager = getSystemService(Context.SEARCH_SERVICE) as SearchManager val searchView = menu.findItem(R.id.search).actionView as SearchView val component = ComponentName(this, SearchResultsActivity::class.java) val searchableInfo = searchManager.getSearchableInfo(component) searchView.setSearchableInfo(searchableInfo) return true }
การเรียกไปยัง
getSearchableInfo()
ได้รับ
วันที่ SearchableInfo
ที่สร้างขึ้นจากไฟล์ XML การกำหนดค่าการค้นหา เมื่อทำการค้นหา
เชื่อมโยงการกำหนดค่าอย่างถูกต้องกับ SearchView
และ
ผู้ใช้ส่งข้อความค้นหา SearchView
จะเริ่มกิจกรรมด้วย
วันที่ ACTION_SEARCH
Intent จากนั้นจึงต้องมีกิจกรรมที่สามารถกรองความตั้งใจนี้และจัดการ
คำค้นหา
สร้างกิจกรรมที่ค้นหาได้
ตัวกรองกิจกรรมที่ค้นหาได้สำหรับ Intent ACTION_SEARCH
และ
ค้นหาข้อความค้นหาในชุดข้อมูล หากต้องการสร้างกิจกรรมที่ค้นหาได้ ให้ประกาศ
กิจกรรมที่คุณเลือกเพื่อกรองACTION_SEARCH
ความตั้งใจ:
<activity android:name=".SearchResultsActivity" ... > ... <intent-filter> <action android:name="android.intent.action.SEARCH" /> </intent-filter> ... </activity>
ในกิจกรรมแบบค้นหาได้ ให้จัดการ Intent ACTION_SEARCH
โดย
กำลังตรวจสอบใน
วันที่ onCreate()
Kotlin
class SearchResultsActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_search_results) handleIntent(intent) } override fun onNewIntent(intent: Intent) { super.onNewIntent(intent) handleIntent(intent) } private fun handleIntent(intent: Intent) { if (Intent.ACTION_SEARCH == intent.action) { val query = intent.getStringExtra(SearchManager.QUERY) Log.d("SEARCH", "Search query was: $query") } } }
ตอนนี้ SearchView
สามารถยอมรับข้อความค้นหาของผู้ใช้และเริ่ม
กิจกรรมที่ค้นหาได้ที่มี Intent ACTION_SEARCH
หลังจากได้คําค้นหาแล้ว คุณสามารถส่งต่อคำค้นหาดังกล่าวไปยัง
ViewModel
ซึ่งสามารถใช้ในเลเยอร์อื่นๆ ของ
เพื่อดึงผลการค้นหามาแสดง