1

アニメーションを作成し、それを複数のスプライト シートに変換しました。次のコードで 1 つのスプライトが問題なく動作しています。

<script type="text/javascript">

var ctx;
var count = 0;
var x;
var y;


var img = new Image();
img.src = "iphone.png";
img.onload = draw;

function init (){
    ctx = document.getElementById("canvas").getContext("2d");
}


function draw(){
    requestAnimationFrame(draw);

    ctx.clearRect(0, 0, 204, 97);

    x = (count % 10) * 204;
    y = Math.floor(count / 10) * 97;
    ctx.drawImage(img, x, y, 204, 97, 0, 0, 204, 97);
    if(count==240)
        count = 0;
    else
        count++;
}

私が今やりたいことは、現在のスプライト シートが IF ステートメントがある "240" に達したら、別のスプライト シートを呼び出すことです。つまり、アニメーションをループする代わりに、別の画像を呼び出して、同じ機能を (その画像で) 再度実行します。私はこれに対する答えを見つけようとして悪夢を見ていますが、それは非常に単純なことだと思わずにはいられません。

4

0 に答える 0