كورس Flutter بالعربي

ماذا ستتعلم؟

• تثبيت Flutter وفهم الـ Widgets والفرق بين Stateless و Stateful
• بناء الواجهات: النصوص والصور والصناديق و Row و Column و Stack و GridView
• التفاعل مع المستخدم: الأزرار والنماذج والتحقق وعناصر الاختيار والنوافذ
• التنقل بين الشاشات، والشريط السفلي والتبويبات والقائمة الجانبية
• الثيمات والوضع الليلي والحركة والتصميم المتجاوب
• جلب البيانات من الإنترنت، وحفظها على الجهاز، وإدارة الحالة بـ Provider
• مشروع تطبيق كامل، ثم بناء ملف APK ونشر التطبيق

فهرس الدروس

1. 1مقدمة في Flutter وتثبيتهتعرّف على Flutter من Google لبناء تطبيقات أندرويد وiOS من كود واحد: ما هي الـ Widgets، وخطوات تثبيت Flutter وفحصه بـ flutter doctor، وشكل أول تطبيق بسيط.
2. 2أول تطبيق Flutter: MaterialApp و Scaffoldابنِ أول تطبيق Flutter وافهم كل سطر فيه: مجلدات المشروع، و main و runApp، و MaterialApp والثيم، و Scaffold بشريط العنوان والزر العائم، وجعل التطبيق عربياً.
3. 3الـ Widgets الأساسية في Flutterتعرّف على أهم Widgets في Flutter: Text و TextStyle، و Container بالمسافات والألوان والزوايا، و Padding و SizedBox، والأيقونات والصور، وابنِ بطاقة تعريف شخصية.
4. 4StatelessWidget و StatefulWidget في Flutterافهم الفرق بين StatelessWidget و StatefulWidget في Flutter: ما هي الحالة State، وتحديث الشاشة بـ setState، وتمرير البيانات، وابنِ عدّاد ضغطات وزر إعجاب.
5. 5Row و Column في Flutter: ترتيب العناصرتعلّم ترتيب العناصر في Flutter بـ Row و Column: المحور الرئيسي والمتقاطع وخصائص المحاذاة، وتوزيع المساحة بـ Expanded، والتراكب بـ Stack، وحل مشكلة Overflow.
6. 6الأزرار والإدخال في Flutter: Buttons و TextFieldتعلّم الأزرار في Flutter بأنواعها وتعطيلها، وحقل الإدخال TextField مع TextEditingController، ومربع الاختيار، ورسائل SnackBar، وابنِ نموذج ترحيب تفاعلياً.
7. 7التنقل بين الشاشات في Flutter: Navigatorتعلّم التنقل بين الشاشات في Flutter: فتح شاشة بـ Navigator.push، والرجوع بـ pop، وتمرير البيانات للشاشة، واستقبال نتيجة منها بـ await، والمسارات المسماة.
8. 8القوائم في Flutter: ListView و ListTileتعلّم عرض القوائم في Flutter: ListView و ListTile الجاهز، و ListView.builder للقوائم الطويلة بكفاءة، والفواصل، وعرض بيانات من كلاس، ومشروع قائمة مهام كاملة.
9. 9تنسيق النصوص في Flutter: TextStyle و Text.richتعلّم تنسيق النصوص في Flutter بالتفصيل: خصائص TextStyle، والمحاذاة، وقص النص الطويل بثلاث نقاط، وتلوين جزء من الجملة بـ Text.rich، وأنماط الثيم، والخط المخصص.
10. 10تزيين الصناديق في Flutter: BoxDecoration والظلال والحدودتعلّم تزيين Container في Flutter بـ BoxDecoration: الزوايا الدائرية والحدود والظلال والتدرج اللوني والشكل الدائري، مع قص المحتوى بـ ClipRRect وضبط الحجم.
11. 11الصور في Flutter: Image.asset و Image.network و BoxFitتعلّم عرض الصور في Flutter من ملفات المشروع ومن الإنترنت: تعريف assets في pubspec.yaml، وطرق ملء المساحة بـ BoxFit، ومؤشر التحميل، وصورة الخطأ، و CircleAvatar.
12. 12هيكل الشاشة في Flutter: Scaffold و AppBar بالتفصيلتعلّم بناء هيكل الشاشة في Flutter: أجزاء Scaffold، وتخصيص AppBar بالأزرار والقوائم المنسدلة، والزر العائم ومكانه، و SafeArea لحماية المحتوى من حواف الهاتف.
13. 13توزيع المساحة في Flutter: Expanded و Flexible و Spacer و Wrapتعلّم توزيع المساحة داخل Row و Column في Flutter: النِّسَب بـ flex، والفرق بين Expanded و Flexible، والفراغ المرن Spacer، والنزول التلقائي لسطر جديد بـ Wrap.
14. 14العناصر المتراكبة في Flutter: Stack و Positioned و Alignتعلّم وضع العناصر فوق بعضها في Flutter باستخدام Stack: تحديد المكان بـ Positioned و Align، وشارة الإشعارات فوق الأيقونة، والنص فوق الصورة، وطبقة التعتيم.
15. 15التمرير في Flutter: SingleChildScrollView والقوائم الأفقيةتعلّم حل خطأ Overflow في Flutter بجعل المحتوى قابلاً للتمرير: SingleChildScrollView للشاشات الطويلة، والقوائم الأفقية، والسحب للتحديث بـ RefreshIndicator.
16. 16الشبكات في Flutter: GridView لعرض المنتجات والصورتعلّم عرض العناصر في شبكة باستخدام GridView في Flutter: عدد الأعمدة الثابت بـ count، والشبكات الطويلة بـ builder، ونسبة أبعاد الخانة، والشبكة المتجاوبة.
17. 17البطاقات في Flutter: Card و ListTile و ExpansionTile و Dismissibleتعلّم بناء عناصر القوائم الاحترافية في Flutter: البطاقة Card، وخصائص ListTile كاملة، والعنصر القابل للطي ExpansionTile، والحذف بالسحب باستخدام Dismissible.
18. 18النماذج والتحقق في Flutter: Form و TextFormField و validatorتعلّم بناء نماذج احترافية في Flutter: ربط الحقول بـ Form و GlobalKey، وكتابة دوال التحقق validator، وعرض رسائل الخطأ تحت كل حقل، والتنقل بين الحقول.
19. 19عناصر الاختيار في Flutter: Checkbox و Switch و Radio و Slider و Dropdownتعلّم عناصر الاختيار في Flutter: مربع الاختيار Checkbox، والمفتاح Switch، وأزرار الراديو، وشريط القيمة Slider، والقائمة المنسدلة، واختيار التاريخ.
20. 20النوافذ والرسائل في Flutter: AlertDialog و BottomSheet و SnackBarتعلّم التحدث مع المستخدم في Flutter: نافذة التأكيد AlertDialog واستقبال اختياره بـ await، واللوحة السفلية showModalBottomSheet، ورسائل SnackBar مع زر التراجع.
21. 21التنقل الرئيسي في Flutter: NavigationBar و TabBar و Drawerتعلّم بناء التنقل الرئيسي في Flutter: الشريط السفلي NavigationBar، وحفظ حالة الصفحات بـ IndexedStack، والتبويبات العلوية TabBar، والقائمة الجانبية Drawer.
22. 22الثيمات في Flutter: ThemeData والألوان والوضع الليليتعلّم توحيد مظهر تطبيق Flutter من مكان واحد: ThemeData و ColorScheme.fromSeed، وقراءة الألوان بـ Theme.of، وتخصيص شكل الأزرار والحقول، والوضع الليلي.
23. 23اللمس والإيماءات في Flutter: GestureDetector و InkWellتعلّم جعل أي عنصر في Flutter يستجيب للمس: الضغط والضغط المزدوج والمطوّل بـ GestureDetector، وتأثير الموجة بـ InkWell، وسحب العناصر على الشاشة بـ onPanUpdate.
24. 24الحركة في Flutter: AnimatedContainer والحركات الجاهزة و Heroتعلّم إضافة الحركة إلى Flutter بالحركات الضمنية: AnimatedContainer و AnimatedOpacity و AnimatedSwitcher، ومنحنيات الحركة Curves، وانتقال Hero بين شاشتين.
25. 25التصميم المتجاوب في Flutter: MediaQuery و LayoutBuilderتعلّم جعل تطبيق Flutter يناسب الهاتف والتابلت والويب: قراءة حجم الشاشة بـ MediaQuery، وتغيير التخطيط بـ LayoutBuilder ونقاط التحول، و AspectRatio و FittedBox.
26. 26دورة حياة الـ Widget في Flutter: initState و dispose والمؤقتاتافهم دورة حياة StatefulWidget في Flutter: متى تُستدعى initState و build و didUpdateWidget و dispose، وكيف تستخدم Timer بأمان، ولماذا تفحص mounted.
27. 27الحزم في Flutter: pub.dev وملف pubspec.yamlتعلّم إضافة المكتبات الجاهزة إلى تطبيق Flutter: البحث في pub.dev واختيار الحزمة الجيدة، وأوامر flutter pub، وقراءة ملف pubspec.yaml، مع مثال عملي بحزمة intl.
28. 28عرض البيانات غير المتزامنة في Flutter: FutureBuilderتعلّم عرض بيانات تحتاج وقتاً في Flutter باستخدام FutureBuilder: حالات التحميل والنجاح والفشل، وقراءة AsyncSnapshot، وتجنب تكرار الطلب، وإعادة المحاولة.
29. 29جلب البيانات من الإنترنت في Flutter: حزمة http و JSONتعلّم ربط تطبيق Flutter بالإنترنت: إرسال طلب GET بحزمة http، وفحص رمز الحالة، وتحويل JSON إلى كائنات Dart بدالة fromJson، وعرضها في قائمة حقيقية.
30. 30حفظ البيانات على الجهاز في Flutter: shared_preferencesتعلّم حفظ الإعدادات والبيانات البسيطة في Flutter لتبقى بعد إغلاق التطبيق: القراءة والكتابة بحزمة shared_preferences، والأنواع المدعومة، وحفظ القوائم بصيغة JSON.
31. 31إدارة الحالة في Flutter: رفع الحالة و ChangeNotifier و Providerتعلّم مشاركة البيانات بين شاشات Flutter: رفع الحالة للأعلى مع الدوال الراجعة، وفصل المنطق في ChangeNotifier، ثم توفيره للشجرة كلها بحزمة Provider.
32. 32مشروع Flutter كامل: تطبيق ملاحظات يحفظ بياناتهابنِ تطبيق ملاحظات كاملاً بـ Flutter يجمع ما تعلمته: كلاس للبيانات مع JSON، وحفظ دائم بـ shared_preferences، وقائمة بالحذف بالسحب، ونموذج إضافة وتعديل بالتحقق.
33. 33بناء تطبيق Flutter ونشره: APK و App Bundle والويبتعلّم تجهيز تطبيق Flutter للنشر: تغيير اسم التطبيق وأيقونته ورقم الإصدار، والفرق بين debug و release، وبناء APK و App Bundle، والتوقيع، والنشر على الويب.