تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
يمكنك التحقّق من صحة الإدخال أثناء كتابة المستخدم في حقل نصي، مثل إدخال اسم أو عنوان بريد إلكتروني أو عنوان أو معلومات اتصال أخرى. يقلل التحقّق من الصحة من
الأخطاء ويوفّر وقت المستخدمين.
توافق الإصدار
يتطلّب هذا التنفيذ ضبط الحد الأدنى من إصدار حزمة تطوير البرامج (SDK) لمشروعك على المستوى 21 من واجهة برمجة التطبيقات أو
مستوى أعلى.
التبعيات
التحقّق من صحة الإدخال أثناء كتابته
استخدِم الرمز التالي لعرض إدخال الحقل والتحقّق من صحة النص أثناء
كتابة المستخدم. إذا لم يتم التحقّق من صحة المعلومات، ستظهر رسالة خطأ تساعد العميل في تصحيح المعلومات التي أدخلها.
classEmailViewModel:ViewModel(){varemailbymutableStateOf("")privatesetvalemailHasErrorsbyderivedStateOf{if(email.isNotEmpty()){// Email is considered erroneous until it completely matches EMAIL_ADDRESS.!android.util.Patterns.EMAIL_ADDRESS.matcher(email).matches()}else{false}}funupdateEmail(input:String){email=input}}@ComposablefunValidatingInputTextField(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@ComposablefunValidateInput(){valemailViewModel:EmailViewModel=viewModel<EmailViewModel>()ValidatingInputTextField(email=emailViewModel.email,updateState={input->emailViewModel.updateEmail(input)},validatorHasErrors=emailViewModel.emailHasErrors)}
يحدِّد عنصرًا قابلاً للتجميع يعيد استخدام المكوّن OutlinedTextField، مع إضافة المَعلمات
المطلوبة لعرض رسائل خطأ المدقّق كأنواع مستخدمين.
يتم استخدام EmailViewModel للحفاظ على الحالة وتوفير منطق التحقّق من صحة عنوان البريد الإلكتروني.
إذا كانت القيمة isError صحيحة، تقدّم واجهة المستخدم مؤشرًا مرئيًا لحالة خطأ في التحقّق من الصحة.
سيعرض المكوّن الرسالة "تنسيق البريد الإلكتروني غير صحيح" إلى أن يتم إدخال عنوان بريد إلكتروني كامل وصحيح.
النتائج
الشكل 1. حقل إدخال نص يتضمّن مدقّقات عناوين بريد إلكتروني لا تعرض أي رسائل خطأ لعنوان بريد إلكتروني صالحالشكل 2. حقل إدخال نص يعرض رسالة خطأ عند إدخال عنوان بريد إلكتروني غير صالح
المجموعات التي تتضمّن هذا الدليل
هذا الدليل هو جزء من مجموعات الأدلة السريعة المنظَّمة التي تتناول
أهداف تطوير Android الأوسع نطاقًا:
النص الذي يظهر للمستخدم
يشكّل النص جزءًا مركزيًا من أي واجهة مستخدم. تعرَّف على الطرق المختلفة
التي يمكنك من خلالها عرض النص في تطبيقك لتوفير تجربة رائعة للمستخدم.
يخضع كل من المحتوى وعيّنات التعليمات البرمجية في هذه الصفحة للتراخيص الموضحّة في ترخيص استخدام المحتوى. إنّ Java وOpenJDK هما علامتان تجاريتان مسجَّلتان لشركة Oracle و/أو الشركات التابعة لها.
تاريخ التعديل الأخير: 2025-02-22 (حسب التوقيت العالمي المتفَّق عليه)
[null,null,["تاريخ التعديل الأخير: 2025-02-22 (حسب التوقيت العالمي المتفَّق عليه)"],[],[],null,["# Validate input as the user types\n\n\u003cbr /\u003e\n\nYou can validate input as the user types in a text field, such as entering a\nname, email, address, or other contact information. This validation reduces\nerrors and saves your users time.\n\nVersion compatibility\n---------------------\n\nThis implementation requires that your project minSDK be set to API level 21 or\nhigher.\n\n### Dependencies\n\n### Kotlin\n\n\u003cbr /\u003e\n\n```kotlin\n implementation(platform(\"androidx.compose:compose-bom:2025.08.00\"))\n \n```\n\n\u003cbr /\u003e\n\n### Groovy\n\n\u003cbr /\u003e\n\n```groovy\n implementation platform('androidx.compose:compose-bom:2025.08.00')\n \n```\n\n\u003cbr /\u003e\n\nValidate input as the user types\n--------------------------------\n\nUse the following code to display the field input and validate the text while\nthe user types. If the information is not validated, an error message helps the\nuser correct the input.\n\n\n```kotlin\nclass EmailViewModel : ViewModel() {\n var email by mutableStateOf(\"\")\n private set\n\n val emailHasErrors by derivedStateOf {\n if (email.isNotEmpty()) {\n // Email is considered erroneous until it completely matches EMAIL_ADDRESS.\n !android.util.Patterns.EMAIL_ADDRESS.matcher(email).matches()\n } else {\n false\n }\n }\n\n fun updateEmail(input: String) {\n email = input\n }\n}\n\n@Composable\nfun ValidatingInputTextField(\n email: String,\n updateState: (String) -\u003e Unit,\n validatorHasErrors: Boolean\n) {\n OutlinedTextField(\n modifier = Modifier\n .fillMaxWidth()\n .padding(10.dp),\n value = email,\n onValueChange = updateState,\n label = { Text(\"Email\") },\n isError = validatorHasErrors,\n supportingText = {\n if (validatorHasErrors) {\n Text(\"Incorrect email format.\")\n }\n }\n )\n}\n\n@Preview\n@Composable\nfun ValidateInput() {\n val emailViewModel: EmailViewModel = viewModel\u003cEmailViewModel\u003e()\n ValidatingInputTextField(\n email = emailViewModel.email,\n updateState = { input -\u003e emailViewModel.updateEmail(input) },\n validatorHasErrors = emailViewModel.emailHasErrors\n )\n}https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/text/TextSnippets.kt#L913-L962\n```\n\n\u003cbr /\u003e\n\n### Key points about the code\n\n- Defines a composable that reuses the [`OutlinedTextField`](/reference/kotlin/androidx/compose/material/package-summary#TextField(kotlin.String,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,kotlin.Boolean,androidx.compose.ui.text.TextStyle,kotlin.Function0,kotlin.Function0,kotlin.Function0,kotlin.Function0,kotlin.Boolean,androidx.compose.ui.text.input.VisualTransformation,androidx.compose.foundation.text.KeyboardOptions,androidx.compose.foundation.text.KeyboardActions,kotlin.Boolean,kotlin.Int,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.compose.ui.graphics.Shape,androidx.compose.material.TextFieldColors)) component, adding the required parameters to display validator error messages as user types.\n- `EmailViewModel` is used to maintain state and provide the email validation logic.\n- if `isError` is true, the UI provides a visual indicator of a validation error state.\n- The component will display \"Incorrect email format.\" until a complete, correct email is input.\n\nResults\n-------\n\n**Figure 1.** A text input field with email validators displaying no error messages for a valid email address. **Figure 2.** A text input field displaying an error message when an invalid email address is entered.\n\nCollections that contain this guide\n-----------------------------------\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\n### Display text\n\nText is a central piece of any UI. Find out different ways you can present text in your app to provide a delightful user experience. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/display-text) \n\n### Request user input\n\nLearn how to implement ways for users to interact with your app by entering text and using other means of input. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/request-user-input) \n\nHave questions or feedback\n--------------------------\n\nGo to our frequently asked questions page and learn about quick guides or reach out and let us know your thoughts. \n[Go to FAQ](/quick-guides/faq) [Leave feedback](https://issuetracker.google.com/issues/new?component=1573691&template=1993320)"]]