Dalam latihan kali ini, kita akan bina aplikasi AutoComplete yang memaparkan cadangan jawapan setiap kali pengguna memasukkan huruf baharu ke dalam ruangan input.

Jika anda perhatikan dengan teliti, AutoComplete merupakan asas kepada populariti enjin carian Google.

Setiap kali anda memasukkan huruf baharu, Google akan memaparkan senarai jawapan yang mungkin anda cari, dengan sepuluh cadangan pertama yang diterbitkan melalui carian paling popular pada minggu tersebut.

Bagi tujuan latihan ini, kita akan diperkenal dengan elemen AutoCompleteTextView, menggantikan elemen TextView yang biasa digunakan di dalam fail activity_main.xml.

Elemen ini dipadankan melalui fail MainActivity.java sama ada melalui inheritance AppCompatActivity atau Activity.

Tanpa membuang masa, mari kita teruskan dengan latihan minggu ini.

LATIHAN

LANGKAH 1: Buka aplikasi Android Studio dan pilih ‘Start a new Android Studio project’, kemudian namakan projek anda sebagai myAutoComplete

LANGKAH 2: Pilih Empty Activity sebagai template projek kali ini.

LANGKAH 3: Tuliskan kod aturcara berikut di dalam fail MainActivity.java.

LANGKAH 4: Tuliskan kod aturcara berikut di dalam fail activity_main.xml

LANGKAH 6: Sambungkan telefon Android anda kepada komputer dan klik butang Run berwarna hijau di Android Studio untuk melihat hasil kerja anda pada peranti Android

SEMAKAN

DALAM projek tadi, kita telah diperkenal dengan elemen baru AutoCompleteTextView yang memaparkan cadangan jawapan penuh berdasarkan array days setiap kali pengguna memasukkan huruf baharu ke dalam kotak input.

Nilai kawalan bagi elemen ini ialah completionTreshold dan requestFocus yang boleh diubah nilainya melalui fail activity_main.xml.

Menerusi latihan tadi, nilai completionTreshold = 1 menandakan bahawa pengguna hanya perlu memasukkan satu huruf untuk mengaktifkan AutoCompleteTextView.

SOALAN

Sebelum ruangan minggu ini ditamatkan, anda perlu menyelesaikan beberapa soalan latihan.

  1. Tambah bilangan hari di dalam array days
  2. Ubah completionTreshold kepada 3
  3. Tambah elemen Toast di dalam fungsi onTextChanged ()

Jika anda mempunyai sebarang pertanyaan atau cadangan, sila tinggalkan komen anda di www.farizgaskin.com dan kami akan cuba jawab sepantas mungkin.

Sehingga bertemu lagi dalam ruangan yang sama minggu hadapan, selamat mencuba!