HTML5 Canvas ゲーム用の良いタイマーを作成するには? RequestAnimationFrame( http://paulirish.com/2011/requestanimationframe-for-smart-animation/ )を使用しています
しかし、オブジェクトの動きが速すぎます。
私のコードのようなものは次のとおりです。
しかし、UP_ARROW プレーヤーを押すと、1 ピクセル移動するのではなく、5、8、または 10 またはそれ以上またはそれ以下のピクセルを移動します。UP_ARROW プレーヤーを押して 1 ピクセル移動するにはどうすればよいですか?
手伝ってくれてありがとう。
問題は、間隔ごとに値をインクリメントするというアプローチによって、一貫性のない結果が生成されることです。あなたのケースでは RequestAnimationFrame のトリガーが速すぎるように聞こえますが、遅い CPU などの他のケースでは、トリガーが遅くなり、異なる結果が得られます。
したがって、ゲーム アニメーションは「絶対」時間に基づく必要があります。つまり、いつ UP_ARROW が押されたか、プレイヤーがその時点でどこにいたかを「覚えておく」必要があります。次に、 update() を呼び出すと、経過した時間が決定され、その時間と目的の速度 (たとえば、1 秒あたりのピクセル数) に基づいて、プレーヤーが適切な位置に移動します。コードはより複雑になりますが、残念ながらそれが実行されなければならない方法です。
この問題はオンラインでよく議論されています。これは私が見つけたランダムな記事の1つです（Flashに基づいていますが、それは問題ではありません）： http://www.flashgamesclassroom.com/classroom/actionscript/frame-based-vs-time-based-animation/
「時間ベースのゲーム アニメーション」をググって、さらに調査することができます。