如何使用Createjs来编写HTML5游戏（七）完成一个简单的打飞机游戏（下）

最新推荐文章于 2021-06-09 17:21:46 发布

lanix516

最新推荐文章于 2021-06-09 17:21:46 发布

阅读量5.6k

点赞数 5

分类专栏： Html5 文章标签： CreateJS html5 游戏碰撞检测

本文链接：https://blog.youkuaiyun.com/lanix516/article/details/47382401

版权

本文介绍了一个空中射击游戏的开发过程，包括星空背景移动、飞机与子弹控制、碰撞检测及得分显示等功能实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

有了游戏中需要的所有元素（战机、敌机、星空、子弹），剩下的东西就是让飞机和子弹动起来，并且检测游戏内各个元素的碰撞情况，也就是逐渐完善tick事件相应中的updateGame(),包含下面几个部分

function updateGame(){

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

首先是星空的移动，让星空从屏幕上方向下移动，这样可以造成一种飞机一直在前进的相对的错觉，所有的星星事先都已经保存在一个数组当中，只要通过循环，取出其中的每个星星，在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 -

最低0.47元/天解锁文章