Createjsを使用してHTML 5ゲームを作成する方法(7)簡単な飛行機遊びを完成する方法(下)

ゲームに必要なすべての要素(戦闘機、敵機、星空、弾丸)があり、残りは飛行機と弾丸を動かし、ゲーム内の各要素の衝突状況を検出すること、つまりtick事件に対応するupdateGame()を徐々に改善することであり、以下の部分を含む.

function updateGame(){

    updateStar();
    updatePlayer();
    updateEnemy();
    updateFire();
    updateMsg();
}

まず星空の移動で、星空をスクリーンの上から下に移動させることで、飛行機がずっと進んでいるという相対的な錯覚を起こすことができ、すべての星は事前に1つの配列に保存されており、循環を通じてその中のすべての星を取り出し、tickでY座標をリセットすればよい.そしてプレイヤーの飛行機、プレイヤーが発射した弾丸と敵機の部分、最後に点数などの情報を更新します.

//    
function updateStar(){
    var i,star,yPos;
    for(i=0;i<200;i++){
        star = starArr[i];
        yPos = star.y + 5*star.alpha;
        if(yPos >= stage.canvas.height){
            yPos = 0;
        }
            star.y = yPos;
        }
}
//            
function updatePlayer(){
    var nextX = player.x;
    if(leftKeyDown){
        nextX = player.x - speed;
        if(nextX<0){
            nextX = 0;
        }
    }else if(rightKeyDown){
        nextX = player.x + speed;
        if(nextX > (sWidth - 37)){
            nextX = sWidth - 37;
        }
    }

    player.x = nextX;
}

//         
function updateFire(){
    var i, nextY,fire;
    for (i=0;i=800 || ex>=600){
                enemy.splice(j,1);
                stage.removeChild(enemy1);
            }
            if(fy < ey+eh && fy > ey && fx>ex && fx 0){
                score += 10;
                fires.splice(i,1);
                enemy.splice(j,1);
                stage.removeChild(fire);
                stage.removeChild(enemy1);
                createjs.Sound.play("explosion");
                var exp1 = new createjs.Sprite(spriteSheet,"exp");
                exp1.x = ex;
                exp1.y = ey;
                exp1.addEventListener('animationend',function(e){
                    stage.removeChild(e.target);
                });
                stage.addChild(exp1);

            }
        }
    }
}
//          
function updateMsg(){
    scoreTxt.text = "score:" + score;
    livesTxt.text = "lives:" + lives;
}

はい、简単ないくつかの部分だけで、ゲームは基本的に完成して、最后に更に1つのcheckGame()を追加してゲームの运行の状态を検査して、もしすべての敌机がすべて消灭してあるいはすでにスクリーンを飞び出して、更に新しい敌机を追加して、その上、私は敌机とプレーヤーの冲突をここに置いて、プレーヤーの飞行机がぶつかって破壊された后に、新しい戦闘机を呼びかけて、しばらくの間無敵だった.

function checkGame(){
    var i,en,pl;
    if(enemy.length==0){
        buildEnemis();
    }
    pl = player;
    plx = player.x;
    ply = player.y;
    plw = player.getBounds().width;
    plh = player.getBounds().height;

    for(i=0;i ply && enx > plx && enx < plx+plw && breakAble){
            stage.removeChild(player);
            pl = null;
            player = null;
            fireAble = false;
            breakAble = false;
            setTime = setTimeout(newPlayer,10);
            break;
        }

    }

}

function newPlayer(){
    clearTimeout(setTime);
    player = new createjs.Sprite(spriteSheet,"ship");
    player.x = sWidth/2 ;
    player.y = sHeight - player.getBounds().height;
    player.alpha = 0;
    createjs.Tween.get(player).to({alpha:1},1000,createjs.Ease.getPowIn(1)).call(function(){
        lives--;
        fireAble = true;
        breakAble = true;
    });
    stage.addChildAt(player,0);
}