前言：
我前面几篇文章都是CocosCreator的基础知识，这里作一个实战游戏并非说咱们的基础知识都学完了，其实还有一部分。不过前面的知识占据了大部分，咱们已经可以制做一些小型的游戏来练练手了，下面就简单的介绍一些这一款小游戏的制做，因为难度系数不大，全部基本在一个小时以内就可以完成，这是在你有前面基础的条件下哦。javascript

项目的源文件下载连接：https://download.csdn.net/download/qq_45021180/12161933
源码文件我上传在csdn了，免费下载不须要任何积分与C币！java

先看一下最后的效果吧
node

分析下制做步骤：

1. 准备好资源，搭建场景

资源的话能够本身到网上找，也能够直接用个人也行；建立好相应文件夹，把资源放到res文件夹下；react

搭建场景：
第一步:建立一个单色精灵(Script) bg 背景, 设置好颜色，加一个Widget组件，使其充满屏幕；
web

第二步： 在bg节点下建立top和button空节点做为顶与底部，而后在两个空节点加入带刺的节点（直接将图片拖到top层级管理器就能够），如今咱们须要给top与button节点添加一个Layout组件,属性设置如图，这样能够看到屏幕上下都有刺了。
dom

第三步： 将玩家小人、子弹、敌机一样的方法加入到场景中，再建立一个Label节点用来显示分数，调节一下位置；
编辑器

2. 代码控制游戏

第一步： 建立一个game脚本，挂载到dg节点上；svg

第二步： 编辑代码，在 properties添加属性，用来关联玩家、子弹、敌人节点，再编辑器关联；函数

第四步： 代码逻辑控制，包括初始化玩家、子弹、敌人；注册监听事件；写动做函数；计分判断等；学习

所有代码：

cc.Class({ 
 
   
    extends: cc.Component,

    properties: { 
 
   
        playerNode: cc.Node,
        enemyNode: cc.Node,
        fireNode: cc.Node,
        scoreNode: cc.Label,
    },
    
     onLoad () { 
 
   
        this.playLoad();
        this.fireLoad();
        this.enemyLoad();
         this.node.on("touchstart",this.fire,this);
         
     },

     update (dt) { 
 
   
          if(Math.abs(this.fireNode.y-this.enemyNode.y)<(this.fireNode.height/3+this.enemyNode.height/3)
            &&Math.abs(this.fireNode.x-this.enemyNode.x)<(this.fireNode.width/3+this.enemyNode.width/3)){ 
 
   
              console.log("击败敌机");
              this.scoreNode.string= ++this.score;//击中得分
            this.fireNode.stopAction(this.fireAction);
            this.enemyNode.stopAction(this.enemyAction);
            this.enemyNode.active=false;
            this.fireNode.active=false;
            this.fireLoad();//初始化子弹
            this.enemyLoad();// 初始化敌机
          }

     },

     // 关闭事件监听
     onDestroy(){ 
 
   
        this.node.off("touchstart",this.fire,this);
     },
    // 初始玩家
    playLoad(){ 
 
   
        this.score=0;
        this.playerNode.y=-cc.winSize.height/4;
        
    },
    //初始化子弹
    fireLoad(){ 
 
   
        this.fireNode.active=true;
        this.isFire=false;
        this.fireNode.x=this.playerNode.x;
        this.fireNode.y=this.playerNode.y+this.playerNode.height;
    },
    // 初始化敌机
    enemyLoad(){ 
 
   
        this.enemyNode.active=true;
        this.enemyNode.x=Math.random()* cc.winSize.width;
        this.enemyNode.y=cc.winSize.height/3;
        let x=cc.winSize.width/2-this.enemyNode.width/2;
        let y=Math.random()* cc.winSize.height/4;
        let seq=cc.repeatForever(cc.sequence(cc.moveTo(1.5,cc.v2(-x,y)),cc.moveTo(1.5,cc.v2(x,y))));
        
        this.enemyAction=this.enemyNode.runAction(seq);
    },
    // 死亡 从新加载游戏
    dear(){ 
 
   
        console.log("死亡");
        cc.director.loadScene("game_scenes");
    },


    // 发射子弹
     fire(){ 
 
   
         if(this.isFire) return;
         this.isFire=true;
        console.log("开始发射");
         var fireaction=cc.sequence(
             cc.moveTo(1,cc.v2(this.playerNode.x,cc.winSize.height/2)),
             cc.callFunc(()=>{ 
 
   
                this.dear();
            }));
        this.fireAction=this.fireNode.runAction(fireaction);
        console.log("结束发射");
     }

});

若是有游戏开发大佬看到，考虑带带笔者，谢谢；

若是有新人对游戏开发感兴趣，能够一块儿学习；

本文同步分享在博客“战胜”（CSDN）。
若有侵权，请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”，欢迎正在阅读的你也加入，一块儿分享。

一个小时完成CocosCreator射击小游戏 (适合初学者)

分析下制做步骤：

1. 准备好资源，搭建场景

2. 代码控制游戏