Anda dapat memvalidasi input saat pengguna mengetik di kolom teks, seperti memasukkan nama, email, alamat, atau informasi kontak lainnya. Validasi ini mengurangi error dan menghemat waktu pengguna.
Kompatibilitas versi
Implementasi ini mengharuskan minSDK project Anda ditetapkan ke API level 21 atau yang lebih tinggi.
Dependensi
Memvalidasi input saat pengguna mengetik
Gunakan kode berikut untuk menampilkan input kolom dan memvalidasi teks saat pengguna mengetik. Jika informasi tidak divalidasi, pesan error akan membantu pengguna memperbaiki input.
class EmailViewModel : ViewModel() { var email by mutableStateOf("") private set val emailHasErrors by derivedStateOf { if (email.isNotEmpty()) { // Email is considered erroneous until it completely matches EMAIL_ADDRESS. !android.util.Patterns.EMAIL_ADDRESS.matcher(email).matches() } else { false } } fun updateEmail(input: String) { email = input } } @Composable fun ValidatingInputTextField( email: String, updateState: (String) -> Unit, validatorHasErrors: Boolean ) { OutlinedTextField( modifier = Modifier .fillMaxWidth() .padding(10.dp), value = email, onValueChange = updateState, label = { Text("Email") }, isError = validatorHasErrors, supportingText = { if (validatorHasErrors) { Text("Incorrect email format.") } } ) } @Preview @Composable fun ValidateInput() { val emailViewModel: EmailViewModel = viewModel<EmailViewModel>() ValidatingInputTextField( email = emailViewModel.email, updateState = { input -> emailViewModel.updateEmail(input) }, validatorHasErrors = emailViewModel.emailHasErrors ) }
Poin-poin penting tentang kode
- Menentukan composable yang menggunakan kembali komponen
OutlinedTextField
, dengan menambahkan parameter yang diperlukan untuk menampilkan pesan error validator saat pengguna mengetik. EmailViewModel
digunakan untuk mempertahankan status dan memberikan logika validasi email.- jika
isError
benar, UI akan memberikan indikator visual status error validasi. - Komponen akan menampilkan "Format email salah" hingga email yang lengkap dan benar dimasukkan.
Hasil
Koleksi yang berisi panduan ini
Panduan ini adalah bagian dari koleksi Panduan Cepat pilihan yang membahas sasaran pengembangan Android yang lebih luas: