May 20, 2025
# نظرة عامة على إطار عمل Flutter UI
## مقدمة
- **Flutter** هو إطار عمل لواجهة المستخدم لبناء التطبيقات عبر الأنظمة (iOS، Android، الويب، سطح المكتب).
- يجمع بين محرك رسومات عالي الأداء ولغة البرمجة **Dart**.
## الميزات الأساسية لـ Dart في Flutter
- **أمان النوع الكامل**: يضمن توافر الثقة في تطوير التطبيقات.
- **إعادة التحميل الساخن مع الحالة**: يسرع عملية التطوير من خلال تمكين المطورين من رؤية التغييرات في الحال.
- **الترجمة إلى كود الجهاز الأصلي**: يضمن العرض السلس على أي منصة.
## بدء العمل مع Flutter
- **التثبيت**: ثبّت Flutter واستخدم الأمر `flutter create` لبدء مشروع جديد.
- **ملف Dart الرئيسي**: الموقع الأساسي لتطوير التطبيق.
## هيكل واجهة المستخدم في Flutter
- **الودجت**: الواجهة عبارة عن شجرة من الودجت. كل شيء في Flutter هو ودجت.
- **الودجات المبنية مسبقًا**: يوفر Flutter مئات الودجات للرسوم المتحركة والتمرير والتخطيطات المتجاوبة وغيرها.
- **الودجات المخصصة**: يتم إنشاؤها بتمديد فئة `StatelessWidget` وتجاوز طريقة `build`.
## الودجات الثابتة مقابل الودجات الديناميكية
- **ودجات ثابتة**
- غير متغيرة، لا تحتوي على بيانات داخلية.
- يتم إعادة بناء الواجهة استجابة للتغييرات في بيانات الإدخال.
- **ودجات ديناميكية**
- تستخدم للعناصر التفاعلية حيث تتغير البيانات الداخلية.
- استخدم `setState` لتحديث البيانات وإعادة عرض الواجهة.
## تطوير باستخدام Flutter
- **أوامر التطوير**:
- **flutter run**: اختبار التطبيق على جهاز حقيقي.
- **Control + Shift + R**: تغليف العناصر مع ودجات أخرى في بيئة التطوير المتكاملة.
- **إعادة التحميل الساخنة**: استخدم الأمر `r` لإعادة تحميل التغييرات بسرعة دون فقد حالة التطبيق.
## تعديلات مثالية
- **مركزية زر**: استخدم غلاف ودجت `Center`.
- **تغيير لون الزر**: معاينة التغييرات مباشرة في بيئة التطوير المتكاملة.
## الخاتمة
- يوفر Flutter تجربة مطور فعالة وممتعة مع تحديثات واجهة مستخدم سريعة وأداء موثوق به.
- لمزيد من التعلم، يمكنك الاطلاع على دورات مثل دورة Flutter Firebase على Fire Ship i/o.