Sunday, December 16, 2018

How to handle keyboard behaviour in Form UI on iOS

Halo,
Di kesempatan kali ini kita bakal membahas tentang cara untuk menghandle keyboard behaviour di iOS. Behaviour ini perlu dihandle iOS developer karena ini adalah action yang sangat sering dilakukan user, misalnya saja memasukkan data untuk melakukan suatu proses. Di Android hal ini tidak terlalu banyak dipermasalahkan karena beberapa behaviour yang akan kita bahas ini sudah dihandle otomatis oleh sistem operasi Androidnya, misalnya mengenai action dari return key di keyboard.

Sekarang kita jabarkan dulu apa aja sih yang perlu dihandle tentang behaviour di Form UI :

  1. UI yang tertutup saat keyboard muncul
  2. Text di return key keyboard
  3. Action dari return key keyboard
3 poin di ataslah yang akan kita bahas kali ini. Oke, tanpa basa-basi langsung saja kita bahas ya

1.  UI yang tertutup saat keyboard muncul


Nah, dari contoh di atas bisa kita lihat bahwa ada sebagian UI yang tertutup saat keyboard muncul. Kalau ini dibiarkan maka user tidak bisa melanjutkan aktivitasnya untuk mengisi textfield yang ada di bawah, tentu saja karena textfield itu tidak bisa diakses. Solusinya adalah dengan menambahkan beberapa fungsi :


Fungsi registerKeyboardNotifications ditaruh di dalam viewWillAppear, sedangkan deregisterFromKeyboardNotifications ditaruh di dalam viewDidDisappear. Tugas dari registerKeyboardNotifications adalah untuk menyampaikan informasi bahwa keyboard akan muncul/hilang sehingga kita bisa mengatur apa yang akan dilakukan saat itu. Fungsi keyboardWasShown/keyboardWillBeHidden bertugas untuk mengatur posisi dan indicator saat keyboard muncul/hilang sehingga tidak lagi menghalangi view yang dipilih user. 

2. Handle text return key (Next/Done)



Pada UITextFieldDelegate, tambahkan fungsi textFieldShouldBeginEditing. Di dalamnya tambahkan pemanggilan fungsi configureReturnKeyText. Isi fungsi configureReturnKeyText adalah sebagai berikut 




Intinya adalah mencari apakah ada textfield dengan tag selanjutnya dari tag textfield yang aktif sekarang. Jika ada, maka jadikan textfield selanjutnya sebagai firstResponder, jika tidak maka sembunyikan keyboard.

3. Handle action return key



Pada UITextFieldDelegate tambahkan fungsi textFieldShouldReturn, di dalamnya tambahkan pemanggilan fungsi configureReturnKeyActionInKeyboard. Isi dari fungsi tersebut adalah 



Terakhir dan yang terpenting, jangan lupa untuk mengatur delegate dan tag dari tiap textfield, berikut adalah cara mudah untuk mengaturnya :
  1. Buatlah array of UITextField, isi array ini dengan textfield yang ada di UI tersebut
  2. Tambahkan fungsi di bawah ini, dan panggil di viewDidAppear



Untuk lebih detailnya bisa lihat di github
Okeeei...sekian pembahasan untuk topik ini, jika ada pertanyaan dan saran bisa komen/kirim e-mail ya.

Keep sharing keep learning 

No comments:

Post a Comment