التصنيف Flutter

SnackBar

ما هو SnackBar؟ SnackBar هو ويدجت من مكتبة Material في Flutter لعرض رسالة خفيفة مؤقتة في أسفل الشاشة، غالبًا مع زر إجراء اختياري (مثلاً “Undo”). الهدف: إعلام المستخدم بسرعة دون إيقاف تفاعله مع التطبيق. Flutter API Docs+1 كيف أُظهر SnackBar…

showBottomSheet

📌 ما هو showBottomSheet؟ ✨ الفرق بين showBottomSheet و showModalBottomSheet الخاصية showBottomSheet showModalBottomSheet النوع Persistent (يبقى مفتوح حتى تغلقه) Modal (يُغلق عند الضغط خارج أو السحب) الإغلاق لازم تغلقه يدويًا (بـ Navigator.pop أو controller) يُغلق تلقائي عند التفاعل الاستخدام عند…

showDialog 

1) ما هو showDialog وماذا يرجع؟ showDialog<T> هو دالة تعرض حوار (modal) فوق واجهة التطبيق، مع حاجز (modal barrier) يمنع التفاعل مع المحتوى الذي تحته. عندما يُغلَق الحوار، تُكمِل الـ Future التي ترجعها الدالة بقيمة (أو null إذا أغلق المستخدم…

Routes

📌 ما هي الـ Routes؟ 🟢 1) الـ Route العادي (MaterialPageRoute / CupertinoPageRoute) أبسط طريقة: 🟢 2) الـ Named Routes (المسارات المسمّاة) بدل ما تبني Route في كل مرّة، تعرّفها في مكان واحد (عادةً داخل MaterialApp). تعريف: استخدام: 🟢 3)…

Navigator

1) الفكرة العامة (مكدس الشاشات — Route Stack) 2) Navigator.push(…) متى تستخدمه؟للتنقل العادي إلى صفحة جديدة مع إمكانية الرجوع (مثلاً من Home → Details). سلوك مهم: الدالة ترجع Future<T?> الذي ينتهي عندما تُغلق الصفحة الجديدة (pop) — هذا يمكن استخدامه…

Pageview

🔹 ما هو PageView؟ 🔹 الأنواع 🔹 أهم الخصائص 1. children / itemBuilder 2. scrollDirection 3. controller مثال: 4. onPageChanged 5. physics 6. pageSnapping 🔹 مثال كامل مع التحكم 🔹 مميزات PageView 🔹 نصائح

BottomNavigationBar

🔹 ما هو BottomNavigationBar ؟ 🔹 مثال بسيط 🔹 أهم الخصائص 1. items 2. currentIndex 3. onTap 4. type 5. selectedItemColor / unselectedItemColor 6. backgroundColor 7. iconSize 8. showSelectedLabels / showUnselectedLabels 🔹 أماكن وحالات الاستخدام 🔹 نصائح 🔹 مثال متقدم…

TabBar

🔹 ما هو TabBar ؟ 🔹 المكونات الأساسية لعمل TabBar تحتاج 3 عناصر: 🔹 مثال أساسي 🔹 شرح الخصائص المهمة في TabBar 🔹 TabBarView 🔹 أماكن الاستخدام 🔹 نصائح ومحاذير 🔹 مثال مع TabBar في أسفل الشاشة ✨ الخلاصة:

Drawer

📌 ما هو الـ Drawer؟ الـ Drawer هو قائمة جانبية (عادةً تُسحب من اليسار في اللغات LTR ومن اليمين في RTL مثل العربية) تُستخدم لعرض خيارات التنقل Navigation أو روابط سريعة داخل التطبيق.يُدمج غالبًا مع Scaffold في الخاصية: 🧩 التركيب…

AppBar

ما هي AppBar؟ شريط علوي مادي (Material) يُعرض عادةً داخل: يوفّر عنوان الصفحة، أزرار رجوع/قائمة، إجراءات (actions)، تبويبات… إلخ. أهم الخصائص (مع الشرح السريع) بنية المحتوى الألوان والارتفاع والظل التخطيط والمحاذاة النصوص والأنماط الشكل والقصّ والتراكب على النظام أمثلة عملية…