javascript - requestAnimationFrame如何控制幀速?
問題描述
想在canvas里實現(xiàn)動畫,動畫是每幀都畫在Sprite上連成一張圖的,試過用setTimeout實現(xiàn)動畫,發(fā)現(xiàn)會跳幀,但是requestAnimationFrame無法控制幀速,我希望1s畫7幀該怎么辦?
問題解答
回答1:requestAnimationFrame就是在瀏覽器下一幀渲染時調用的,所以可以認為requestAnimationFrame的調用速率就是瀏覽器的刷新速率,一般來說是60幀
但是requestAnimationFrame調用callback的時候會傳入一個時間戳參數(shù),可以根據(jù)這個參數(shù)來進行判斷從而處理你實際需要的幀速
比如要1秒7幀的話可以這樣寫
let step = (timestamp, elapsed) => { if (elapsed > 1000 / 7) {//TO DO SOMETHINGelapsed = 0 }window.requestAnimationFrame(_timestamp => step(_timestamp, elapsed + _timestamp - timestamp) )}window.requestAnimationFrame(timestamp => step(timestamp, 0))回答2:
貌似不可控,瀏覽器自己計算的
回答3:1s7幀這種刷新速率...本來就是'跳幀'的效果...
相關文章:
1. javascript - js中遞歸與for循環(huán)同時發(fā)生的時候,代碼的執(zhí)行順序是怎樣的?2. python - linux怎么在每天的凌晨2點執(zhí)行一次這個log.py文件3. php如何獲取訪問者路由器的mac地址4. android - 鍵盤遮擋RecyclerView5. 如何分別在Windows下用Winform項模板+C#,在MacOSX下用Cocos Application項目模板+Objective-C實現(xiàn)一個制作游戲的空的黑窗口?6. javascript - jQuery each 方法第三個參數(shù)args 如何解釋?7. javascript - 在 vue里面用import引入js文件,結果為undefined8. java - new + 類名,一定需要申明一個對象嗎?9. javascript - vue-resource中如何設置全局的timeout?10. 小程序怎么加外鏈,語句怎么寫!求救新手,開文檔沒發(fā)現(xiàn)
