キャンバスrequestAnimationFrameポーズ

Question

requestAnimationFrameでキャンバスアニメーションを一時停止するにはどうすればよいですか？今、私はKeyDownイベントの後に一時停止オプションを追加したい

window.requestAnimFrame = (function() { 
    return window.requestAnimationFrame  || 
      window.webkitRequestAnimationFrame || 
      window.mozRequestAnimationFrame || 
      function(callback) { 
       window.setTimeout(callback, 1000/60); 
      }; 
})(); 

function Start() { 
    Update(); 
    requestAnimFrame(Start); 
} 

Start(); 

：

コード： は、私はこのようなアニメーションを開始します。それを行う簡単な方法はありますか？

Answer 1

アニメーションの状態（一時停止または一時停止していない状態）を保存する変数を作成することができます。ボタンをクリックするたびにその状態を変更します。このような何か作業をする必要があります：

var isPaused = false; 

window.requestAnimFrame = (function() { 
    return window.requestAnimationFrame  || 
      window.webkitRequestAnimationFrame || 
      window.mozRequestAnimationFrame || 
      function(callback) { 
       window.setTimeout(callback, 1000/60); 
      }; 
})(); 

function Start() { 
    if (isPaused) { 
     Update(); 
    } 

    requestAnimFrame(Start); 
} 

window.onkeydown = function() { 
    isPaused = !isPaused; // flips the pause state 
}; 

Start();