Android Membuat Icon Mata Pada EditText Password

Pada masa sekarang ini hampir semua aplikasi android memerlukan proses login, baik itu login secara umum (register lewat facebook dan google) ataupun register berdasarkan local email (misalnya email@putuguna.com)

Jika diperhatikan lagi pada EditText passwordnya terdapat icon mata. Icon mata berfungsi untuk melihat atau menyembunyikan password. Adanya icon mata pada EditText password akan menambah indah design form login yang telah dibuat.

Akan ada dua icon mata yang terlihat pada form yaitu icon mata biasa dan icon mata bergaris. Pertanyaannya adalah bagaimana membuat 2 fungsi berbeda pada setiap icon mata? Jawabannya adalah disetting hanya pada layout xml nya saja.

Agar lebih cepat memahami, mari kita mulai membuat project password visibility. Ikuti langkah-langkah dibawah ini :

Compile Library Support

Untuk membuat project ini, kita memerlukan salah satu material design yaitu TextInputLayout. Untuk mendapatkannya, harus mengcompile library dibawah ini :

Buat File XML Di Drawable

File ini digunakan untuk memunculkan icon mata yang berbeda-beda saat diklik, namun defaultnya adalah icon mata biasa (tanpa garis):

Untuk icon mata dapat di download disini :

  1. Icon mata terbuka, download disini
  2. Icon mata tertutup (ada garisnya), download disini

File XML Login Dengan Icon Mata

Selanjutkan membuat sebuah layout atau form login atau bisa langsung di implementasikan di project kalian. Untuk membuat fungsi password visibility dan invisibility cara menggunakan app:passwordToogleDrawable dan app:passwordToogleEnable. Lihat koding dibawah ini :

Jalankan program, maka hasilnya akan seperti gambar dibawah ini :

Hasil akhir

Silakan download projectnya disini :

(Visited 146 times, 1 visits today)



Baca juga :


About The Author

Related Posts

Add Comment

Berlangganan Artikel

Untuk mendaftarkan tutorial pemrograman terbaru dari putuguna[dot]com, silakan tuliskan email kalian dibawah ini