الفصل 22 — السبرايتات وصفائح السبرايت والحركة

المستوى: متوسط المدة المقدّرة: 6 ساعات المتطلبات المسبقة: الفصل 19 (Flutter بوتيرة سريعة)، الفصل 20 (حلقة اللعبة وdelta time)، الفصل 21 (الإحداثيات والرسم على Canvas) ما ستتمكن من فعله في نهاية الفصل: تحميل صورة وتقطيعها إلى إطارات، ثم عرض شخصية متحركة لا تعتمد سرعة حركتها على معدل الإطارات — مع ملف صورة على القرص أو بدونه.

22.0 — أهداف الفصل

في نهاية هذا الفصل ستكون قادرًا على:

• شرح ما هو السبرايت (sprite) وبماذا يختلف عن شكل مرسوم يدويًا؛
• الاختيار بين البكسل آرت (pixel art) والرسم التوضيحي (illustration)، واستخلاص النتائج التقنية لهذا الاختيار؛
• شرح لماذا يكون السبرايت بصيغة PNG ولا يكون أبدًا بصيغة JPEG؛
• العثور على سبرايتات حرة الاستخدام وقراءة الرخصة دون الوقوع في الخطأ؛
• تعريف مجلد assets/ في pubspec.yaml بالمسافة البادئة الصحيحة؛
• تحميل صورة باستخدام rootBundle.load وdecodeImageFromList؛
• شرح لماذا يكون هذا التحميل غير متزامن وما يترتب على ذلك؛
• تحميل جميع الصور مسبقًا قبل بدء حلقة اللعبة؛
• رسم صورة باستخدام canvas.drawImage()؛
• رسم جزء من صورة باستخدام canvas.drawImageRect()؛
• تغيير حجم سبرايت دون تشويهه؛
• الحفاظ على بكسل آرت حاد تمامًا بفضل FilterQuality.none؛
• قلب سبرايت أفقيًا باستخدام scale(-1, 1)؛
• قراءة صفيحة سبرايت (sprite sheet) وحساب Rect المصدر لأي إطار؛
• تحويل فهرس إطار إلى زوج (صف، عمود)؛
• كتابة صنف SpriteSheet قابل لإعادة الاستخدام؛
• كتابة صنف للحركة يتقدم بحسب delta time؛
• التعامل مع الحركات غير المتكررة (الموت، الهجوم)؛
• تنظيم عدة حركات لكل شخصية في آلة حالات؛
• تغيير الحركة دون التسبب في قفزة بصرية؛
• التعرف على texture bleeding وتصحيحه؛
• قراءة أطلس (atlas) وملف وصفه؛
• توليد إطاراتك بنفسك عبر الشيفرة، دون تنزيل أي ملف؛
• إنجاز شخصية متحركة تمشي وتتوقف.