ComposeUI/UX

Compose ile OTP Input Field Oluşturma

Tasarımda kullanıcı deneyimini (UX) yüksek tutabilmek için kullanıcı alışkanlarını dikkate alarak proje geliştirmek önemli bir konudur.

Bu makale Android Compose tasarımında OTP (Tek Kullanımlık Şifre) input alanını nasıl oluşturabileceğimizi örnekleyerek açıklayacaktır.

OTP ve OTP Input Nedir?

OTP banka, sosyal medya vb. hesaplarınıza giriş yaparken oluşturulan tek kullanımlık şifredir. SMS yoluyla gönderilen şifreyi alıp, ilgili sistemde giriş yapacağınız alana da OTP Input denir.

Compose tasarımında BasicTextField arayüz elamanına görsel ve işlevsel özellikler ekleyerek OTP Input oluşturacağız.

OTP Input Field Oluşturma

Tek kullanımlık şifreler, sadece rakamlardan oluşur. Klavyede sadece rakamları göstererek kullanıcıya kolaylık sağlayacağız. Bunun için klayve türünü NumberPassword (KeyboardType.NumberPassword) olarak belirtmeliyiz.

İlk önce bir kotlin dosyası oluşturup, OtpTextField compose fonksiyonu içerisinde BasicTextField tanımlayarak başlıyoruz. Kodların arasına yazdığım açıklamalarla tamamını okuyarak inceleyelim.

 

Hazırladığımız OtpTextField fonksiyonunu MainActivity sınıfımızda kullanalım.:)

 

 

 

 

 

 

Bülten
Bültene abone ol

Bültene abone olarak yeni makalelerimden haberdar olun.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir