از Pista Academy حمایت کنید
مرور سریع مفاهیم اصلی پیش از تماشای کامل یا برای جمعبندی بعد از آموزش.
در جلسه 72 آموزش فلاتر، مدرس به بررسی و فعال کردن ولیدیشن در فرم افزودن آیتم میپردازد. ابتدا یک کلید گلوبال به نام فرم کی تعریف شده و به فرم اختصاص داده میشود. سپس متدی به نام سیو آیتم نوشته میشود که مقادیر وارد شده توسط کاربر را بررسی میکند و در صورت عدم پر کردن فیلدها، پیام خطا نمایش میدهد. همچنین، دکمهای برای پاک کردن فرم ایجاد شده است. در ادامه، مقادیر وارد شده به متغیرهایی ذخیره و به صورت نمایشی نمایش داده میشوند. در نهایت، به بررسی یک فیلد عددی و تبدیل آن به نوع داده مناسب پرداخته میشود. همچنین، تدریس به نحوی است که نشان میدهد وقتی UI تغییر میکند، استیت باید بهروزرسانی شود و مدل به درستی اعمال شود.
نکات کلیدی
تعریف یک کلید گلوبال برای دسترسی به فرم و فعال کردن ولیدیشن.
نوشتن متد سیو آیتم برای ذخیره و بررسی مقادیر وارد شده توسط کاربر.
ایجاد دکمه ریست برای پاک کردن فرم.
ذخیره مقادیر وارد شده به متغیرهایی و نمایش آنها به صورت نمایشی.
بررسی فیلد عددی و تبدیل آن به نوع داده مناسب.
بهروزرسانی استیت در صورت تغییر UI.
بررسی صحیح عملکرد مدل و ذخیره دیتا.
متن ویدیو
متن زمانبندیشده این جلسه برای مرور، جستجو و دسترسی سریعتر.
سلام عرض میکنم خدمت دوستان عزیز. بریم سراغ ادامه بحثمون و ما اپلیکیشنمون رسید
به اینجا که این دکمه اد آیتم رو درست
کردیم.
ما یه ولیدیشن یادتون باشه اضافه کردیم به
این در حقیقت پروژهمون. خب و توی نیو آیتم
یه ولیدیشنی ما نوشتیم ایناش مثلاً خب
حالا سؤالی که پیش میاد اینکه این
ولیدیشنو ما چیکار کنیم که کار بکنه چون
الان فکر نکنم کار بکنه من اینو بزنم کار
نمیکنه چون الان خالیه اینا باید این
پیغام رو نشون بده وقتی خالیه
برای اینکه بخوایم ولیدیشن رو فعال کنیم
یا کلاً بچهها بخوایم روی فرم کار بکنیم
توی فلاتترل ما باید یک کلید کلیدی رو
تعریف بکنیم و نسبت بدیم به این فرمه.
پس اول باید یه کلید تعریف بکنم. میام
داخل
اینجا تو استیتم
میگم فاینال
یه اسم براش میذارم مثلاً اسمشو میذارم فورم کی. هر اسمی دوست دارید میتونید
بذارید با گلوبال کی.
پس یه کلید گلوبال من تعریف میکنم. خب
تو فاز بعدی میام این کلیده رو اختصاص
میدم به این فرمه. فرمم کو؟
یه جاهم اینجاها باید باشه ایناش میام کلیدمو
حالا من میتونم به این فرم دستور دسترسی داشته باشم و یک سری اکشنا روش انجام بدم.
به عنوان مثال عرض میکنما ما الان این
پایین اومده بودیم گفته بودیم زمانی که
دکمه ادو میزنه کوش
اینها یه آمپرس داشتیم دیگه من اینجا الان
میتونم بیام بگم که اگر دکمه اد آیتمو زد
بیا یه فانکشنی یه متدی رو فراخونی بکن
بعد تو اون متده میتونم از فرم کی استفاده
کنم یه چیزی م یادم رفت اینجا ما باید یه
چیزم اضافه کنیم
اینم باید اضافه کنید. خب حالا بریم سراغ این آمپرست.
پس من اینجا قراره یک متدی بنویسم یک متدی
بنویسم زمانی که دکمه اد رو میزنه اجرا
بشه. مثلاً اسمشو میذارم سیو آیتم
مثلاً حالا بریم سیو آیتم رو بنویسیم.
کاری که باید انجام بده رو بنویسیم.
سیو آیتم خب در نهایت باید بره اون آیتم رو سیو کنهها فعلاً پرون کاری نداریم ولی
فعلاً من میخوام اولین کاری که میکنه این
باشه که ولیدیشن رو چک بکنه و درق بررسی
بکنه پس من باید روی فرمم ولیدیشن بزنم
اول بذارید بنویسم وید این فانکشن هیچی
برنمیگردونه سیو آیتم
خب
میگم که برای اینکه دسترسی به فرمم داشته
باشم از طریق فرم کینگ کار میکنم بعد
میگم کارنت استیت
مطمئنم هستم نال نیست پس یه دونه علامت
تعجب اینجا میزنم میگم روش ولیدیشن انجام
بده ولیدیت
به این صورت بریم الان ببینیم خروجی رو
الان نگاه کنید این خالیه بزنم پیغام خطا رو نمایش میدم اون پیغامی که اینجا ست
کرده بودم ایناش
توی کوانتیتی هم اگه من اینو بذارم منفی ۱
باز اینجا یه پیغام خطا میده
پس الان ولیدیشنو تونستیم فعال بکنیم یه چیزی هم راسته یادم رفته بود توی
اجازه بدید کوانتیتی
کنار اینیشرشیال ولیو
یه چیزی هم اضافه کنید به
اینو یادمون رفته بود کیبورد تایپ
مشخصه دیگه کیبورد تایپمون چی باشه
تکست
اینپوت تایپ بعد روی نامبر بذارید فقط عدد باید یا
وقتی کیبورد باز میشه حروف نباشه فقط عدد
باشه چون عدد میخواد وارد کنه دیگه خب
الان اینجا نگاه کنید من اینجا کیبوردم
میبینی عدد نیست حروفم توشه درسته حالا
من اینو کردم بهش نامبریم تغییر میکنه
ف کن الان فقط عدده چرا چون اینجا فقط عدد باید وارد بکنم اوکی
ما یه دکمه ریستم اینجا گذاشته بودیم که فرممونو ریست بکنه دوباره با استفاده از
همین کلیدی که تعریف کردیم میتونیم برای
ریست هم اقدام بکنیم
یه دونه دکمه پایین داشتیم
همین جا فانکشنشو مینویسم نمیبرمش دیگه
بالا همین جا مینویسم میگم فونکی
کارنت
استیت مطمئنم هستم نال نیست ریست همین جا
کارو درمیارم به این صورت
بریم چک کنیم اینو
من یه چیزی اینجا بنویسم اینجا هم مثلاً یه عددی بذاریم
آ ادو زدم ببخشید ریست ریست شد اوکی
بریم سراغ ادامه کار
بریم سراغ مرحله بعدی تو مرحله بعدی من
ولیدیشن رو وقتی چک کردم
استپ بعدیم اینه که برم مقادیری که کاربرم
وارد کرده رو یه جایی ذخیره کنم بعد ببرم
ازش استفاده کنم د تا کار باید بکنم یک
مقادیری که کاربرم وارد کرده رو توی خود
فرمه نشون بدم د ببرم سمت دیتابیس ذخیره
کنم دیتابیس باشه جلسه بعدی این جلسه اول
نشون دادن نشون ببینیم با همدیگه پس من
ولیدیشنم وقتی انجام شد میام میگم که برو
مرحله بعدی
فم کی کنت است مطمئنم هستم نال نیست سیو
حالا من به یه چیزی دسترسی دارم توی فرم به نام آنسیو میتونم برم متد آن سیو رو
داخل فرم ازش استفاده کنم به واسطه اون
سیوی که این بالا نوشتم
میام داخل چیز اینجا اول اینجا فرمی که دارم چیه برای
چیه اسمش
نیمه
برای نیم بعد از این ولیدیشن
اینجا فکر کنم
آره میگم آن سیو این آن سیو کیفراخونی
میشه موقع که اون سیو بالا زد فراخونی بشه
یه ولیویی رو به عنوان ورودی داره که من
میتونم یه کاری باهاش انجام بدم.
خب این ولیو بچهها همین مقداریه که کاربر
من تو این اینپوته وارد کرده برای نیم
همونه.
گفتم میخوام اینو یه جا ذخیره کنم. پس
اول میام یه وریبلی تعریف میکنم این بالا
بغل کی یه وریبلی تعریف میکنم اسمشو میذارم اینترد نیم
مقدار اولشم یه استرینگ خالی
حالا اینجا میام میگم که وقتی آن سیووو
فراخونی کردی کجایی
تو گمش کردم اینا
بیا بگو این برابر همون ولیوه که کاربرم
وارد کرده
مطمئنم هستم نال نیست یه چیزی وارد کرده چرا چون قبلش ولیدیشن رو چک کردم مطمئنم
نال نیست
پس من کاربرم یه چیزی وارد کرد من مطمئن
شدم که نال نیست و بعد ذخیرهش کردم داخل
یه متغیری به نام اینترنیم
یه جور دیگه هم بچهها میشه اینو نوشت
خب خب چهجوری نوشت تو اینجا من بیام بگم
این سیوه رو منوت کن به یه چیزی اگر اگر
این فرم که کانت استیت ولید ترو بود اگر این ترو بود
اونوقت آنسیو فرار میکنه اینجوری هم بنویسید قشنگتره بچهها
این معنیش اینه که اگر این رو بود بیا
اینو انجام بده اینجوری
مطمئنم هستید نسبت به درق ولیوتون که نال
نیست دیگه
حالا من ولیو رو گرفتم گفتم یکی از کارایی
که باید بکنیم چیه باید این ولیو رو یه جا
نمایش بدم دیگه خب فعلاً بچهها این پرینت
میذارم اینجا یه دونه فعلاً پرینت
میم اینو یه
ترمینالمم نشون بده فعلاً تا بعد جلسه
بعدی بیام اینو ببرم ذخیرهش کنم
بریم یه چکم بکنیم
تا اینجا رو
نگاه کنید الان من چیزی که اینجا وارد میکنم باید ذخیره بشه مثلاً بزنم
برد
ایناش
خب پس داره کار میکنه حالا ب سراغ استپ بعدی فرم بعدیمون چیه یه
یه وریبل براش درست کنم و
و
اسمشو میذارم اینترت
کوانتیتی
میام پایین میام پایین میام پایین اینجا اول که اینو مساویه میذارم
خب فقط یه نکتهای داره الان میام بهتون
میگم
پس اینرشیال ولیو رو دیگه برابر این
میذارم خب خب اس بعدی چیه؟ آها [خنده]
نکتهشو بم اینجا بگم این باید تبدیل شه به
استرینگ چون عدده
تو استرینگ
حالا آنسیوو اینجاهمون استفاده میکنم میگم که
بیا اینجا کجا بذارمش آنسیو و بعد از
ریترن اینجا
آن سیود
به مقداری که کاربرم وارد کرده دسترسی
دارم میام میگم که
اینتردت کوانتیتی برابر باشه با اون چیزی که کاربرم وارد کرده از جنس استرینگه باید
اول تبدیلش کنم ایندا
پارس
اون چیزی که کاربرم وارد کرده نالم نیست
مطمئنم
اینجا باید تبدیلش کنم به اینتیجر ذخیره
کنم اینجا برعکسش اینتیجر تبدیل کنم
میتونم به استرینگ نشون بدم اینو یا
حواستون باشه باشه
این از این دیگه چی
آها بریم سراغ دراپ دانو رفتیم اینو رفتیم بریم دراپ دان دراپان
بچهها چیزی آنسیو نداره خب یعنی یه مدل
دیگه باید باهاش کار بکنیم
اول میریم بالا یه متغیر براش تعریف
میکنم
ور سلکتد
کتگوری
جنس اینترت نیست دیگه یه چیزی داره سلکت
میکنم باید برم توی مدلم مدل کتگوریم خب
از اونجا یه دونه مقداری بیارم یعنی باید
برم توی دیتا کتگوری یکی از اینا رو بیارم
خب خب میام میگم که
برو تو کتگوریز
خب از اینجا بیارش نگاه کن ایمپورتش کن بالا
ایمپورتش کرد
دات مثلا یکی از اونا رو انتخاب کنید مثلاً من اینو انتخاب میکنم بهش تبلو
آ این میتونه فاینال باشه حالا کاری نداریم
اینم نال نیست بچهها اینم قطعی نال نیست دیگه پس اینو بذارید پشتش چرا داره خطا
میده
آها این کتگوری با سی کوچیکه ببخشید اینه اشتباه
آوردمش اینه
مدلو نمیخواد بیارید از دیتا باید
میخوند من اشتباه گفتم کتگوریز برو داخلش
کتگوری فش تبل
یعنی برو توی دیتا به این کتگوری دسترسی
داشته باش اینو بیار ش
الان دردت چیه؟ خب باشه باشه فاینال میتونه باشه
حالا
میام داخل دراپ دانم خب
اینو کپی کنم
میام داخل دراپ دان من اینجا یه متد آنچنج
داشتم اینها تو متد آنچنج وقتی تغییری
داخل دراپون اتفاق بیفته اولین کاری که
میکنم اینه که سلکتد ولیو رو برابر
میذارم با ولیوی که سلکت شده این مورد
اول که اینم م نال نیست مطمئنم نال نیست
چون ولیدیشن قبلش چک شده است بعدی چیه
باید بیام مقدار اولیه
آ یه چیزی راستی اینجا ببینش تو ست استیت بچهها چون قراره بچهها ما کی ست استیت
استفاده میکنیم موقعی که قراره توی یوآی
سایت یوآی اپون چیزی عوض بشه خب من اینجا
وقتی میخوام این تغییر بکنه اینقدر داره
یوآی تغییر میکنه دیگه پس باید برمش تو
ست استیت
ست استیت داخل این باید اینو تغییر بدم
الان بهتر شد که یوآی هم تغییر بکنه حالا
اینجا توی دراپ دان
یه ولیو اضافه میکنم برابر میذارم با سلکتد کتگوری
که وقتی آنچنج اتفاق میفته استیت تغییر میکنه این مقدارش عوض میشه توی صفحه
نمایش میده
نکته دیگه اجازه بدید ببینم چیزی جا نمونده باشه
فقط بریم یه پرینتم بزنیم خروجیشو ببینیم
فکر کنم مدلشم باید میآوردم بچهها مدلشو نیاورده بودم آره مدلشو نباید پاک میکردم
اوکی خب الان درست شد
درست حالا میایم اینجا مثلاً اینو میدم میلک
مثلاً چه میدونم کوانتیتی مثلاً ۱۰ تا
اینم میذارم روی دی پرینت نگاه کنید سه
تاش اومد میلک تن
خب مشکل ن درسته یه بار دیگه باهم چک کنیم
این دیفالتشو نگاه کنیم که روی وجتیبل
باشه این دیفالتش باید رو وجتیبل باشه
اینو چک نکردیم درسته بریم بیایم جلسه
بعدی بریم سراغ ذخیره این دیتا فعلاً
خداحافظ بس
پرسشهای رایج
پاسخ کوتاه و مستقیم به پرسشهایی که معمولاً هنگام یادگیری این موضوع مطرح میشوند.
برای فعال کردن ولیدیشن در فرم، یک کلید گلوبال به نام فرم کی تعریف میشود و به فرم اختصاص داده میشود. سپس متدی به نام سیو آیتم نوشته میشود که مقادیر وارد شده را بررسی میکند و در صورت عدم پر کردن فیلدها، پیام خطا نمایش میدهد.
برای پاک کردن فرم، یک دکمه ریست ایجاد میشود که با فعال شدن آن، فرم به حالت اولیه خود بازگردانده میشود.
مقادیر وارد شده به متغیرهایی ذخیره میشوند و به صورت نمایشی در UI نمایش داده میشوند.
فیلد عددی با تبدیل آن به نوع داده مناسب مدیریت میشود تا به درستی در فرم نمایش داده شود.
آخرین بهروزرسانی محتوای متنی:
در این دوره جامع و پروژهمحور با فلاتر و دارت از صفر تا صد آشنا میشوید و با ساخت هشت اپلیکیشن واقعی که هر کدام نکات کلیدی و پرکاربرد فلاتر را پوشش میدهد، مهارتهای خود را به سطح بعدی میبرید. آنچه در این دوره یاد میگیرید: مقدمه و نصب ابزارها: آشنایی با فلاتر، دارت و راهاندازی محیط توسعه مبانی دارت و فلاتر: یادگیری سینتکس دارت و ساخت ویجتهای پایه با اپ «تاسانداز (Roll Dice)» غوطهوری در فلاتر: پیادهسازی اپ «کوئیز (Quiz)» برای مسلط شدن بر ساختار و چرخه حیات ویجتها دیباگ و رفع اشکال: تکنیکهای عیبیابی و ابزارهای Flutter DevTools واکنشگرایی و تمینگ: ساخت «Expense Tracker» برای یادگیری ویجتهای تعاملی، موضوعبندی (Theming) و طراحی ریسپانسیو مدیریت وضعیت (State Management): از Provider تا روشهای داخلی دارت با اپ «TODO» و «Meals» مسیریابی بین صفحات: ناوبری پیشرفته با «Meals App» و انتقال داده بین صفحات انیمیشنها و جلوههای بصری: افزودن حرکات پویا و تراکیب انیمیشنی در «Meals App» فرمها و ورودی کاربر: دریافت و اعتبارسنجی اطلاعات با «Shopping List» ارتباط با سرور: ارسال و دریافت HTTP، کار با JSON و REST API در «Shopping List» دسترسی به امکانات بومی دستگاه: استفاده از دوربین و ذخیرهسازی در «Favorite Places» فراخوانی پوش نوتیفیکیشن و چت زنده: ترکیب فلاتر با Firebase برای ساخت اپ چت با اعلان لحظهای بهروزرسانیها و چشمانداز آینده: نکات پایانی، منابع پیشرفته و مسیر یادگیری ادامهدار چرا این دوره؟ پروژهمحور و گامبهگام، مناسب برای تازهکارها و افراد با تجربه متوسط پوشش تمام جنبههای کلیدی: از طراحی رابط کاربری و انیمیشن تا اتصال به سرور و مدیریت وضعیت پیادهسازی چندین اپلیکیشن واقعی که میتوانید به سادگی برای نمونهکار شخصی یا پروژههای شغلی استفاده کنید لینک گیت هاب دوره جهت دسترسی به کد پروژه های هر فصل https://github.com/pistaacademy/flutter 🔔 همین حالا سابسکرایب کنید تا ویدیوهای آینده را از دست ندهید و یادگیری فلاتر را با هم شروع کنیم!