文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

怎么使用CocosCreator实现射击小游戏

2023-06-14 13:07

关注

这篇文章主要介绍怎么使用CocosCreator实现射击小游戏,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

分析下制作步骤:

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

资源的话可以自己到网上找,也可以直接用我的也行;创建好相应文件夹,把资源放到res文件夹下;

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

怎么使用CocosCreator实现射击小游戏

bg节点下创建topbutton空节点作为顶与底部,然后在两个空节点加入带刺的节点(直接将图片拖到top层级管理器就可以),现在我们需要给top与button节点添加一个Layout组件,属性设置如图,这样可以看到屏幕上下都有刺了。

怎么使用CocosCreator实现射击小游戏

将玩家小人、子弹、敌机同样的方法加入到场景中,再创建一个Label节点用来显示分数,调节一下位置;

怎么使用CocosCreator实现射击小游戏

2. 代码控制游戏

创建一个game脚本,挂载到dg节点上;

编辑代码,在 properties添加属性,用来关联玩家、子弹、敌人节点,再编辑器关联;

怎么使用CocosCreator实现射击小游戏

代码逻辑控制,包括初始化玩家、子弹、敌人;注册监听事件;写动作函数;计分判断等;

全部代码:

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("结束发射");     }});

最终效果

怎么使用CocosCreator实现射击小游戏

以上是“怎么使用CocosCreator实现射击小游戏”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注编程网行业资讯频道!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     807人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     351人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     314人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     433人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     221人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯