Column و Row
Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("الأوّل"),
Text("الثاني"),
],
)
Row(
children: [Icon(Icons.star), Text("تقييم")],
)
mainAxisAlignment: المحور الرئيسي (عمودي لـ Column).crossAxisAlignment: المحور المتقاطع.
Container
Container(
width: 200,
padding: EdgeInsets.all(16),
margin: EdgeInsets.symmetric(vertical: 8),
decoration: BoxDecoration(
color: Colors.purple,
borderRadius: BorderRadius.circular(12),
),
child: Text("صندوق منسّق"),
)
Expanded و Flexible
يملأ المساحة المتاحة داخل Row/Column:
Row(
children: [
Expanded(child: Text("يتمدّد")),
Text("ثابت"),
],
)
ويدجتس مساعدة
Padding(padding: EdgeInsets.all(8), child: ...)
SizedBox(height: 16) // فراغ
Center(child: ...)
Stack(children: [...]) // طبقات فوق بعض
🎯 التالي: القوائم والشبكات.