Image
عرض الصور Image
Image يعرض صورة من الشبكة أو الأصول المحلية أو الذاكرة، بثلاثة مُنشِئات مختلفة حسب المصدر.
Image.network للصور من رابط، Image.asset لصور مضمّنة بالمشروع (مسجّلة بـ pubspec.yaml)، وImage.memory لصورة محمّلة كـ bytes بالذاكرة مباشرة.
الصياغة
Image.network(url, width: double, height: double, fit: BoxFit)
Image.asset('assets/images/logo.png')📄 مثال
Image.network(
'https://picsum.photos/300/200',
width: 300,
height: 200,
fit: BoxFit.cover,
loadingBuilder: (context, child, progress) {
return progress == null ? child : CircularProgressIndicator();
},
)أهم المعاملات
| المعامل | الوظيفة |
|---|---|
| fit | طريقة ملء المساحة المتاحة (BoxFit.cover, contain, fill...) |
| loadingBuilder | ويدجت بديل أثناء تحميل صورة الشبكة |
| errorBuilder | ويدجت بديل إذا فشل تحميل الصورة |
💡 نصائح عملية
- أضف errorBuilder دائمًا لصور الشبكة — روابط الصور قد تنكسر بأي وقت
⚠️ أخطاء شائعة
- نسيان تسجيل مجلد assets بملف pubspec.yaml — Image.asset يفشل بصمت أو برسالة غير واضحة بدونه
خصائص ذات صلة
🎓 تريد فهم الصورة الكاملة خطوة بخطوة؟ ابدأ من مسار FLUTTER الكامل بالعربي.