The Daily Journal

Tutorial Menggunakan SearchView Sederhana (Android Studio)

Tutorial Menggunakan SearchView Sederhana ? Bagaimana cara menggunakan SearchView? Apa saja yang dibutuhkan untuk menggunakan SearchView?

Tutorial Menggunakan SearchView Sederhana adalah tutorial perkenalan kamu dengan SearchView. Tutorial ini menjelaskan tentang SearchView dan apa saja yang dibutuhkan untuk memberikan fitur search pada aplikasi Android. Apa itu SearchView? SearchView adalah salah satu user interface yang tersedia pada layout Android Studio. Kegunaan dari SearchView adalah untuk mencari data atau hal lainnya pada aplikasi hasil buatan Android Studio.

Baca juga : Tutorial Sederhana Menggunakan ListView (Android Studio)

SearchView digunakan oleh pengguna dengan cara memasukkan huruf atau kata maupun kalimat pada SearchView untuk dicari. Metode input huruf atau kata maupun kalimat dibagi menjadi dua, yaitu metode input huruf satu persatu dan langsung ditemukan hal yang dicari tanpa memencet tombol enter atau ok. Sedangkan metode kedua adalah metode input perkata yang harus diklik tombol enter atau ok baru akan mengeluarkan hasil pencarian.

Pencarian yang akan kita gunakan masih dalam ruang lingkup kecil. Kita akan menggunakan SearchView dengan metode pertama. Dimana hasil pencarian akan langsung keluar pada saat user memasukkan huruf atau kata maupun kalimat tanpa memencet tombol enter atau ok. Mari kita mulai tutorialnya.

Pertama bukalah Android Studio. Lalu klik Start a new Android Studio project seperti gambar di bawah ini :

Akan muncul pop up Create New Project. Pilih Empty Activity lalu klik Next seperti gambar di bawah ini :

Kemudian isi kotak Name dan kotak lainnya seperti gambar di bawah ini, untuk Save location isi sesuai tempat dimana kamu biasa menyimpan project Android Studio :

Buka app -> res -> layout -> activity_main.xml , salin kode di bawah ini lalu temple di activity_main.xml. Pada kode di bawah terdapat view SearchView dan ListView di dalam parent layout bernama LinearLayout :

Kita akan menggunakan ListView sebagai penampung data yang akan dicari. Pada kode di atas kita menggunakan ConstraintLayout.

Setelah itu buka app -> java -> com.example.android.searchviewsederhana -> MainActivity. Amati sebentar MainActivity. Lalu tambahkan kode array String untuk menampung data String untuk ListView :

Buatlah field private ArrayAdapter bertipe String, ArrayList bertipe String, ListView, SearchView di dalam kelas MainActivity tepatnya di atas method onCreate seperti kode di bawah ini :

Gunakan field array adapter bertipe data String yang sudah kita definisikan diatas. Tempel kode di bawah ini di dalam method onCreate. Adapter berguna untuk mengatur tata letak ListView :

Kita menggunakan adapter sederhana karena datanya pun masih sangat sederhana, yaitu array String. Pada kode diatas, this berarti context MainActivity, android.R.layout.simple_list_item_1 berarti letak data ListView sederhana seperti data yang berurutan dari bawah ke atas.

Masih tetap di metode onCreate pada MainActivity. Gunakan field ListView untuk temukan ListView dengan nama id nya yang sudah kita tambahkan di main_activity.xml seperti kode berikut ini :

Kemudian pasang variabel ListView dengan adapter yang sudah kita buat. Berikut kode nya dan kode ini masih ditempelkan di metode onCreate pada MainActivity :

Coba run maka akan keluar data ListView dan SeacrhView pada emulator. Namun SearchView belum memiliki tugas. Mari kita buatkan tugas untuk SearchView.

Setelah itu gunakan field ArrayList yang sudah kita definisikan di atas method onCreate, gunakan di dalam method onCreate. Beri isi di bagian kanan sama dengan (=) pada array list lalu lakukan perulangan untuk mendapatkan seluruh data String array ke dalam array list seperti kode berikut ini :

Setelah itu ubah bagian akhir arrayAdapter menjadi kode seperti berikut ini :

Kemudian gunakan field SearchView di dalam method onCreate dan temukan SearchView pada layout menggunakan findById di dalam method onCreate seperti kode di bawah ini :

Lalu pada bagian paling bawah di dalam method onCreate, tulis kode seperti di bawah ini untuk menyaring pencarian :

Pada kode di atas ada dua method boleean di dalam setOnQueryTextListener. Kita menggunakan method onQueryTextChange untuk tutorial ini karena dengan menggunakan method onQueryTextChange, user dapat menemukan hasil pencarian langsung dari huruf atau kata yang dicari di pencarian tanpa di klik ok atau enter

Coba run aplikasi SearchView Sederhana ini dan temukan hal – hal yang bisa dicari dalam aplikasi tersebut. Berikut ini demo aplikasi SearchView Sederhana :

Untuk download full source code disini

Baca juga : Tutorial ListView Menggunakan Kelas Adapter Buatan

Sekian, terimakasih, dan semoga bermanfaat:)