| محتويات |
|
| عقد الأزرار | تخطيطات استجابة |
خلق حلقة لعبة
عند إنشاء الألعاب أو الصور أو العفاريت، تضاف إلى الفيلم لتمثيل العناصر في الألعاب مثل الأحرف أو المركبات أو انفجارات. يتم ضبط موقف العفريت مرات كثيرة ثانية من داخل حلقة اعتماداً على بعض منطق اللعبة. كل فيلم وقد بنيت في حلقة اللعبة، تسمى 'على التحديث'. ويطلق عليه في كل مرة يمكن العثور على تحديثات الرسوم المتحركة، وفي خصائص الفيلم.
إنشاء فيلم جديد وإضافة صورة، وتسمى أيضا العفريت. لقد استخدمنا كرة الشاطئ.
 | استيراد |
إنقر لحفظ هذه الصورة إلى حاسوبك
BeachBall.png
في خصائص الإطار الأولى للكرة الشاطئية، إيقاف المخطط الزمني ومجموعة في 'معرف البرنامج النصي' إلى Ball. إيقاف تشغيل الخط الزمني يسمح الكرة التحكم باستخدام جافا سكريبت.
ونحن ذاهبون لجعل الكرة الشاطئية ترتد حول الفيلم. ولذلك نحن بحاجة إلى إنشاء بعض متغيرات السرعة في 'العام' الحدث البرنامج النصي. وسوف تفعل أي القيم الأولية.
في 'على التحديث' الحدث، يمكننا أن نجعل الكرة تتحرك بإضافة قيم السرعة X و Y القيم للكرة.
Ball.Y+=VelocityY;
اضغط play لاختبار الفيلم. الكرة يجب أن تطير مباشرة قبالة الفيلم.
 | Play |
X و Y هي خصائص للكرة في نقطة المركز. بالتحقق من هذه القيم ضد العرض والارتفاع للفيلم، يمكننا التحقق لمعرفة إذا كان يجب أن ترتد الكرة. لترتد الكرة، ببساطة عكس السرعة.
Ball.Y+=VelocityY;
var MovieWidth=600,MovieHeight=400,BallRadius=50;
if(Ball.X>MovieWidth-BallRadius){VelocityX=-VelocityX;}
if(Ball.X<BallRadius){VelocityX=-VelocityX;}
if(Ball.Y>MovieHeight-BallRadius){VelocityY=-VelocityY;}
if(Ball.Y<BallRadius){VelocityY=-VelocityY;}
اضغط play لاختبار الفيلم مرة أخرى. الآن يجب أن ترتد الكرة حولها.
تصدير الفيلم إلى HTML، ولاحظ أن الكرة يتحرك بسرعة مختلفة قليلاً للاعب. وهذا يرجع إلى أن تشغيل متصفحات الويب المختلفة، والأجهزة المختلفة بسرعات مختلفة.
لتجعل الكرة تتحرك بنفس السرعة في كل مكان، نحن بحاجة إلى حساب الفارق الزمني بين تحديثات. 'على التحديث' الحدث ويشمل اثنين من متغير مفيدة أن يفعل ذلك. TimeChange: عدد الإطارات التي مرت منذ آخر تحديث. SecondsChange: عدد الثواني التي مرت منذ آخر تحديث. تكون هذه القيم مستقلة عن ما إذا كان تم إيقاف الفيلم أم لا. ببساطة طريقة لحساب الوقت منذ آخر تحديث. لجعل الرسوم المتحركة التي تعمل دائماً بنفس السرعة، يحتاج كل تغيير في موقف أو زاوية أو التعتيم تكون مضروبة في التغيير في الوقت أو ثانية.
Ball.Y+=VelocityY*TimeChange;
var MovieWidth=600,MovieHeight=400,BallRadius=50;
if(Ball.X>MovieWidth-BallRadius){VelocityX=-VelocityX;}
if(Ball.X<BallRadius){VelocityX=-VelocityX;}
if(Ball.Y>MovieHeight-BallRadius){VelocityY=-VelocityY;}
if(Ball.Y<BallRadius){VelocityY=-VelocityY;}
اختبار الفيلم في المشغل و HTML. ينبغي تحريك الكرة بالضبط بنفس السرعة في كليهما.
| عقد الأزرار | تخطيطات استجابة |