فرم‌ها و TextField

کاربر قرار نیست فقط نگاه کنه؛ باید تایپ کنه، خراب کنه، دوباره تایپ کنه.

درس 7 از 12

TextField با State

TextField مقدارش را از state می‌گیرد و با onValueChange آن را آپدیت می‌کند. یعنی ورودی کاربر باید همیشه جایی ذخیره شود.

فرم نام

@Composable
fun NameForm() {
    var name by remember { mutableStateOf("") }

    Column {
        TextField(
            value = name,
            onValueChange = { name = it },
            label = { Text("نام") }
        )
        Text("سلام $name")
    }
}

خروجی یا نتیجه اجرا

کاربر هرچه تایپ کند، متن سلام همان لحظه به‌روز می‌شود.

نکته کاربردی: فرم‌ها در لاگین، سرچ، ثبت سفارش و پروفایل everywhere هستند. state تمیز یعنی فرم کم‌دردسر.

نتیجه این درس 🎯

ورودی کاربر را گرفتی. حالا وقتش است اپ با بیرون حرف بزند؛ یعنی API و شبکه.

تمرین! 🧠

یک TextField برای ایمیل بساز و زیرش مقدار ایمیل را نمایش بده.

جواب تمرین

@Composable
fun EmailForm() {
    var email by remember { mutableStateOf("") }
    Column {
        TextField(value = email, onValueChange = { email = it }, label = { Text("ایمیل") })
        Text("ایمیل وارد شده: $email")
    }
}

خروجی جواب

با تایپ ایمیل، متن زیر TextField همزمان تغییر می‌کند.