"إذا أراد العامل أن يؤدي عمله بشكل جيد، فعليه أولاً أن يشحذ أدواته." - كونفوشيوس، "مختارات كونفوشيوس. لو لينجونج"
الصفحة الأمامية > برمجة > كيف يمكنني استخدام RequestAnimationFrame لتثبيت معدل إطارات الرسوم المتحركة (FPS)؟

كيف يمكنني استخدام RequestAnimationFrame لتثبيت معدل إطارات الرسوم المتحركة (FPS)؟

تم النشر بتاريخ 2024-11-09
تصفح:612

How can I use RequestAnimationFrame to stabilize my animation\'s frame rate (FPS)?

RequestAnimationFrame Fps Stabilization

أصبح RequestAnimationFrame (rAF) سائدًا في الرسوم المتحركة، مما يوفر تنفيذًا سلسًا وفعالًا. ومع ذلك، فإن التحكم في معدل الإطارات (FPS) لضمان الاتساق قد يكون أمرًا صعبًا.

خنق rAF إلى FPS محدد

لخنق rAF إلى FPS معين، يمكنك وقت الرافعة المالية المنقضي منذ تنفيذ الإطار الأخير. سيتم تنفيذ رمز الرسم الخاص بك فقط عند انقضاء الفاصل الزمني المطلوب لإطار الإطارات في الثانية (FPS).

مقتطف الكود

تهيئة متغيرات المؤقت وبدء الرسوم المتحركة:

var stop = false; فار إطار عدد = 0; var fps، fpsInterval، startTime، now، إذن، انقضى؛ وظيفة startAnimating(fps) { fpsInterval = 1000 / إطار في الثانية؛ ثم = Date.now(); startTime = ثم؛ تحريك () ؛
var stop = false;
var frameCount = 0;
var fps, fpsInterval, startTime, now, then, elapsed;

function startAnimating(fps) {
    fpsInterval = 1000 / fps;
    then = Date.now();
    startTime = then;
    animate();
}

function animate() { requestAnimationFrame(animate); الآن = Date.now(); انقضى = الآن - ثم؛ إذا (المنقضي> fpsInterval) { ثم = الآن - (المنقضية٪ fpsInterval)؛ // رمز الرسم الخاص بك موجود هنا }
function animate() {

    requestAnimationFrame(animate);

    now = Date.now();
    elapsed = now - then;

    if (elapsed > fpsInterval) {
        then = now - (elapsed % fpsInterval);
        // Your drawing code goes here
    }
}
أحدث البرنامج التعليمي أكثر>

تنصل: جميع الموارد المقدمة هي جزئيًا من الإنترنت. إذا كان هناك أي انتهاك لحقوق الطبع والنشر الخاصة بك أو الحقوق والمصالح الأخرى، فيرجى توضيح الأسباب التفصيلية وتقديم دليل على حقوق الطبع والنشر أو الحقوق والمصالح ثم إرسالها إلى البريد الإلكتروني: [email protected]. سوف نتعامل مع الأمر لك في أقرب وقت ممكن.

Copyright© 2022 湘ICP备2022001581号-3