اعتبار ورودی را با نوع کاربر تأیید کنید

شما می‌توانید ورودی‌ها را هنگام تایپ کاربر در یک فیلد متنی، مانند وارد کردن نام، ایمیل، آدرس یا سایر اطلاعات تماس، اعتبارسنجی کنید. این اعتبارسنجی خطاها را کاهش داده و در زمان کاربران شما صرفه‌جویی می‌کند.

نتایج

یک ورودی متن معتبر
شکل ۱. یک فیلد ورودی متن با اعتبارسنج‌های ایمیل که هیچ پیام خطایی برای آدرس ایمیل معتبر نمایش نمی‌دهند.
ورودی متن نامعتبر با خطا
شکل ۲. یک فیلد ورودی متن که هنگام وارد کردن آدرس ایمیل نامعتبر، پیام خطا نمایش می‌دهد.

سازگاری نسخه

این پیاده‌سازی مستلزم آن است که minSDK پروژه شما روی سطح API 21 یا بالاتر تنظیم شده باشد.

وابستگی‌ها

اعتبارسنجی ورودی هنگام تایپ توسط کاربر

از کد زیر برای نمایش ورودی فیلد و اعتبارسنجی متن در حین تایپ کاربر استفاده کنید. اگر اطلاعات اعتبارسنجی نشود، یک پیام خطا به کاربر کمک می‌کند تا ورودی را اصلاح کند.

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
    )
}

نکات کلیدی در مورد کد

  • یک composable تعریف می‌کند که از کامپوننت OutlinedTextField استفاده مجدد می‌کند و پارامترهای مورد نیاز برای نمایش پیام‌های خطای اعتبارسنجی را به عنوان نوع کاربر اضافه می‌کند.
  • EmailViewModel برای نگهداری وضعیت و ارائه منطق اعتبارسنجی ایمیل استفاده می‌شود.
  • اگر isError درست باشد، رابط کاربری یک نشانگر بصری از وضعیت خطای اعتبارسنجی ارائه می‌دهد.
  • این کامپوننت تا زمانی که یک ایمیل کامل و صحیح وارد نشود، عبارت «قالب ایمیل نادرست است» را نمایش می‌دهد.

مجموعه‌هایی که حاوی این راهنما هستند

این راهنما بخشی از این مجموعه‌های راهنمای سریعِ برگزیده است که اهداف گسترده‌تر توسعه اندروید را پوشش می‌دهد:

متن بخش اصلی هر رابط کاربری است. روش‌های مختلفی را برای ارائه متن در برنامه خود بیابید تا یک تجربه کاربری لذت‌بخش ارائه دهید.
یاد بگیرید که چگونه روش‌هایی را برای تعامل کاربران با برنامه خود با وارد کردن متن و استفاده از سایر روش‌های ورودی پیاده‌سازی کنید.

سوالی یا بازخوردی دارید؟

به صفحه سوالات متداول ما بروید و درباره راهنماهای سریع اطلاعات کسب کنید یا با ما تماس بگیرید و نظرات خود را با ما در میان بگذارید.