Перейти к содержимому

تصميم Food Delivery App بـ Flutter 🔥 Home Screen UI من الصفر | للمبتدئين

Osama Essam

0:00 / 0:00

تصميم Food Delivery App بـ Flutter 🔥 Home Screen UI من الصفر | للمبتدئين

12 просмотров · 3 дня назад
Osama Essam
441 подписчик
12 просмотров · 3 дня назад
في السيشن دي من سلسلة تعلم **Flutter بالتطبيق العملي**، هنكمل بناء تطبيق توصيل طعام بسيط، وهنصمم الـ Home Screen خطوة بخطوة باستخدام Flutter Widgets. *هنتعلم في السيشن دي:* تصميم الـ Header وإضافة أيقونات القائمة والإشعارات. استخدام Row وColumn لترتيب العناصر. التحكم في المسافات باستخدام Padding وSizedBox. إضافة Divider لتنظيم أجزاء الشاشة. تصميم Search Bar باستخدام TextField وInputDecoration. إزالة الحدود الافتراضية وتعديل شكل حقل البحث. إنشاء قسم Categories لعرض تصنيفات الطعام. إضافة الصور المحلية باستخدام Assets وملف `pubspec.yaml`. عرض التصنيفات أفقيًا باستخدام ListView. تصميم كروت الطعام باستخدام Container وBoxDecoration. إضافة الصور والأسماء والأسعار وأيقونات المفضلة. استخدام BorderRadius لتدوير الحواف. إضافة BoxShadow لعمل ظل للكروت. فهم الفرق بين Padding وMargin. استخدام SingleChildScrollView لحل مشاكل التمرير وتجاوز الشاشة. تكرار عناصر الواجهة باستخدام ListView بدلًا من كتابة كل عنصر بشكل منفصل. *أهم حاجة في السلسلة:* مش هدفنا نحفظ الكود أو ننقله، لكن نفهم كل Widget بتعمل إيه وإمتى نستخدمها، ونتعلم إزاي نبحث عن الحل لما نقابل مشكلة أثناء البرمجة. في السيشن الجاية هنكمل بناء باقي شاشات التطبيق ونضيف مميزات جديدة بالتدريج. #Flutter #Dart #FlutterUI #FoodDeliveryApp #FlutterForBeginners #MobileDevelopment