استفاده از این محتوا رایگان میباشد

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

آموزش کار با Textfield در فلاتر ❤️

سایت مرجع

آموزش کار با Textfield

میخوایم توی این بخش با همدیگه با ویجت Textfield آشنا بشیم خب داخل پروژه بعضی وقتا نیاز هست

که کاربر یه مقداری رو وارد کنه و ما اون رو دریافت بکنیم.

برای این منظور ما از ویجت Textfield استفاده میکنیم ! دانلود سورس بیسیک فور اندروید

من بخوام خیلی ساده این ویجت و نمایش بدم

اون childeren مربوط به column رو اول اجرا میکنم و توی اون ویجت Textfield و به صورت زیر فراخانی میکنم:

TextField(

),

خب حالا ما چه طوری مقداری رو که کاربر وارد کرده رو بخونیم ؟ با استفاده از متد onchange !

وقتی که این متد رو صدا بزنیم هر لحظه که کاربر یه کاراکتر رو وارد کرد این متدصدا زده میشهو ما میتونیم اون مقدار رو دریافت کنیم.

برای در یافت مقدار به صورت زیر عمل میکنیم.

خب توی کد های بالا ما اومدیم از متد setstate استفاده کردیم و بهش میگم که کاربر هر موقه یه مقداری رو وارد کرد

این Value رو بریز داخل یه متغییر دیگه

و یه متغییر هم تعریف کردیم از نوع String اسمش رو هم گذاشتیم Title و یه مقدار خالی رو هم بهش دادیم

بعد گفتیم که هر موقه کاربر یه مقداری رو وارد کرد این Title من برابر باشه با این Value

که کاربر وارد کرده و بعد هم این Title رو گفتیم توی یه Text نمایش بده

return Scaffold(
body: Co1umn(
children: <Widget>[

TextFie1d(
onchangedz (String value){
setState(() {
title = value;
});

}:
), 

Text(title),
]: 
), 
);

خروجی به صورت زیر میشه :

آموزش کار با Textfield در فلاتر

توی تصویر زیر میخوایم این موضوع رو بهتر درک کنیم با دقت بررسی بفرمایید.

خب توی تصویر بالا میبینید من هر چی که وارد کنم.

داخل تکس پایین همون متن و به من نشون میده این Textfield هم متد های مختلفی داره

که میتونیم ازش استفاده بکنیم به عنوان مثال

اگه من بخوام یه متن فارسی رو توش بنویسم که از سمت راست شروع کنه طبق روش زیر عمل میکنیم.

TextField(
textDirection: TextDirection.rtl,
onchangedz (String value){
setState(() {
title = value;

});

}:
), 

Text(title),

طبق کد های بالا دیدید که تونستیم که این textfield رو راست چین کنیم

و بهش Style بدیم و یا خاصیتش رو کاری کنیم که فقط بشه توش عدد تایپ کرد

با متد keyboardType اینم از آشنایی با ویجت Textfiled موفق باشید.

آموزش کار با ویجت column-widget در فلاتر ( بخش 14 ) ❤️
کاربرد mediaquery در فلاتر ❤️
, , , , , ,

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

این قسمت نباید خالی باشد
این قسمت نباید خالی باشد
لطفاً یک نشانی ایمیل معتبر بنویسید.
شما برای ادامه باید با شرایط موافقت کنید

فهرست