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

📱 شرح Flutter

الصور والأصول

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

صورة من الإنترنت

Image.network("https://example.com/photo.jpg")

صورة محلّية (Asset)

أولًا سجّلها في pubspec.yaml:

flutter:
  assets:
    - assets/images/logo.png
    - assets/images/

ثم استخدمها:

Image.asset("assets/images/logo.png")

خصائص الصورة

Image.asset(
  "assets/logo.png",
  width: 100,
  height: 100,
  fit: BoxFit.cover,      // كيف تملأ المساحة
)

الأيقونات

Icon(Icons.favorite, color: Colors.red, size: 30)

الخطوط المخصّصة

flutter:
  fonts:
    - family: Cairo
      fonts:
        - asset: assets/fonts/Cairo-Regular.ttf
Text("نصّ", style: TextStyle(fontFamily: "Cairo"))

⚠️ بعد تعديل pubspec.yaml، أوقف التطبيق وأعد تشغيله (hot reload لا يكفي للأصول الجديدة).

🎯 التالي: إدارة الحالة.

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