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

📱 شرح Flutter

الويدجتس بعمق (Widgets)

الدرس 8 من 25· ⏱ 1 دقائق قراءة

كل شيء ويدجت

في Flutter، الواجهة كلّها شجرة من الويدجتس (Widget Tree) — النصّ، الزرّ، التخطيط، حتى التطبيق نفسه.

StatelessWidget

ويدجت بلا حالة متغيّرة (يرسم مرّة حسب مدخلاته):

class Greeting extends StatelessWidget {
  final String name;
  const Greeting(this.name, {super.key});

  @override
  Widget build(BuildContext context) {
    return Text("أهلًا $name");
  }
}

ويدجتس أساسية

Text("نصّ")
Icon(Icons.star)
Image.network("https://...")
ElevatedButton(onPressed: () {}, child: Text("زر"))
Container(padding: EdgeInsets.all(16), child: Text("صندوق"))

Scaffold — هيكل الصفحة

Scaffold(
  appBar: AppBar(title: Text("صفحتي")),
  body: Center(child: Text("المحتوى")),
  floatingActionButton: FloatingActionButton(
    onPressed: () {},
    child: Icon(Icons.add),
  ),
)

💡 تتعلّم Flutter بتركيب الويدجتس الجاهزة — مكتبة Material غنيّة جدًّا.

🎯 التالي: الويدجتس ذات الحالة.

هل كان هذا الدرس مفيدًا؟