تخطَّ إلى المحتوى

Stack

التراكب (وضع فوق بعض) Stack

Stack يضع ويدجتس فوق بعضها البعض (تراكب طبقات) بدل ترتيبها بخط — مثالي للشارات فوق الصور أو التصاميم المتراكبة.

الأبناء يُرسَمون بالترتيب: الأول بالأسفل، الأخير بالأعلى. تُستخدم Positioned داخل Stack لتحديد موضع دقيق لأي ابن (بدل الاعتماد على الترتيب الافتراضي فقط).

الصياغة

Stack(
  children: [
    Widget, // القاعدة
    Positioned(top: 8, right: 8, child: Widget), // فوقها بموضع محدد
  ],
)

📄 مثال

Stack(
  children: [
    Image.network('https://picsum.photos/200', width: 200, height: 150),
    Positioned(
      top: 8,
      right: 8,
      child: Icon(Icons.favorite, color: Colors.red),
    ),
  ],
)

أهم المعاملات

المعاملالوظيفة
childrenالويدجتس المتراكبة، الأول أسفل والأخير أعلى
alignmentمحاذاة افتراضية للأبناء غير المُحاطين بـ Positioned

💡 نصائح عملية

  • استخدم Positioned.fill لجعل ويدجت يملأ كل مساحة الـ Stack بالضبط

⚠️ أخطاء شائعة

  • نسيان أن ترتيب children يحدّد الطبقة — العنصر الأخير بالقائمة هو الأعلى ظهورًا

خصائص ذات صلة

🎓 تريد فهم الصورة الكاملة خطوة بخطوة؟ ابدأ من مسار FLUTTER الكامل بالعربي.