Menyiapkan antarmuka penelusuran

Mencoba cara Compose

Jetpack Compose adalah toolkit UI yang direkomendasikan untuk Android. Pelajari cara menambahkan fungsi penelusuran di Compose.

Memfilter daftar →

Sebaiknya gunakan widget SearchView sebagai item di panel aplikasi untuk menyediakan fungsi penelusuran di aplikasi Anda. Seperti semua item di panel aplikasi, Anda dapat menentukan SearchView untuk ditampilkan setiap saat atau hanya jika ada ruang. Anda juga dapat menentukannya sebagai tindakan yang dapat diciutkan, yang menampilkan SearchView sebagai ikon pada awalnya, lalu menggunakan seluruh panel aplikasi sebagai kolom penelusuran saat pengguna mengetuk ikon.

Menambahkan SearchView ke panel aplikasi

Untuk menambahkan widget SearchView ke panel aplikasi, buat file di project Anda yang bernama res/menu/options_menu.xml dan tambahkan kode berikut ke file tersebut. Kode ini menentukan cara membuat item penelusuran, seperti ikon yang digunakan dan judul item. Atribut collapseActionView memungkinkan SearchView Anda diperluas untuk menggunakan seluruh panel aplikasi dan ditutup kembali menjadi item panel aplikasi normal saat tidak digunakan. Karena ruang panel aplikasi terbatas di perangkat handset, sebaiknya gunakan atribut collapsibleActionView untuk memberikan pengalaman pengguna yang lebih baik.

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

Jika Anda menginginkan ikon penelusuran yang lebih mudah diakses, buat file ic_search.xml di folder /res/drawable dan sertakan kode berikut di dalamnya:

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

Untuk menampilkan SearchView di panel aplikasi, perluas resource menu XML res/menu/options_menu.xml dalam metode onCreateOptionsMenu() aktivitas Anda:

override fun onCreateOptionsMenu(menu: Menu): Boolean {
    menuInflater.inflate(R.menu.options_menu, menu)

    return true
}

Menjalankan aplikasi akan menghasilkan tampilan seperti ini:

SearchView muncul di panel aplikasi aplikasi Anda, tetapi tidak berfungsi. Jika mengetuk ikon penelusuran, Anda akan mendapatkan tampilan seperti ini:

Agar SearchView berfungsi, Anda harus menentukan perilaku SearchView.

Membuat konfigurasi penelusuran

Konfigurasi penelusuran menentukan cara SearchView berperilaku dan ditentukan dalam file res/xml/searchable.xml. Konfigurasi penelusuran harus berisi, minimal, atribut android:label yang memiliki nilai yang sama dengan atribut android:label dari elemen <application> atau <activity> di manifes Android Anda. Namun, sebaiknya Anda juga menambahkan atribut android:hint untuk memberikan gambaran kepada pengguna tentang apa yang harus dimasukkan ke dalam kotak penelusuran.

<?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" />

Dalam file manifes aplikasi, deklarasikan elemen <meta-data> yang mengarah ke file res/xml/searchable.xml. Deklarasikan elemen dalam <activity> tempat Anda ingin menampilkan 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>

Dalam metode onCreateOptionsMenu() yang Anda buat, kaitkan konfigurasi penelusuran dengan SearchView dengan memanggil setSearchableInfo(SearchableInfo):

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
}

Panggilan ke getSearchableInfo() akan mendapatkan objek SearchableInfo yang dibuat dari file XML konfigurasi penelusuran. Jika konfigurasi penelusuran dikaitkan dengan SearchView Anda dengan benar dan pengguna mengirimkan kueri, SearchView akan memulai aktivitas dengan intent ACTION_SEARCH. Kemudian, Anda memerlukan aktivitas yang dapat memfilter intent ini dan menangani kueri penelusuran.

Membuat aktivitas yang dapat ditelusuri

Aktivitas yang dapat ditelusuri memfilter intent ACTION_SEARCH dan menelusuri kueri dalam set data. Untuk membuat aktivitas yang dapat ditelusuri, deklarasikan aktivitas pilihan Anda untuk memfilter intent ACTION_SEARCH:

<activity android:name=".SearchResultsActivity" ... >
    ...
    <intent-filter>
        <action android:name="android.intent.action.SEARCH" />
    </intent-filter>
    ...
</activity>

Dalam aktivitas Anda yang dapat ditelusuri, tangani intent ACTION_SEARCH dengan memeriksa intent tersebut di metode onCreate().

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")
        }
    }
}

Sekarang, SearchView dapat menerima kueri pengguna dan memulai aktivitas yang dapat ditelusuri dengan intent ACTION_SEARCH.

Setelah mendapatkan kueri penelusuran, Anda dapat meneruskannya ke ViewModel, tempat Anda dapat menggunakannya di lapisan lain arsitektur untuk mengambil hasil penelusuran yang akan ditampilkan.