
CocosCreator零基础制作游戏《极限跳跃》四、添加游戏主场景控制脚本
前面简单的实现了主界面的UI设置,现在我们开始制作游戏的控制脚本。
在资源管理器的Script文件夹中,点击右键新建javascript文件,命名为GAME。
双击打开GAME脚本,在properties: 中添加属性代码。
//GAME.js cc.Class({ extends: cc.Component, properties: { // player 节点,用于获取主角弹跳的高度,和控制主角行动开关 player: { default: null, type: cc.Node }, // bgsprite1 节点,用于背景移动 bgsprite1: { default: null, type: cc.Node }, // bgsprite2 节点,用于背景移动 bgsprite2: { default: null, type: cc.Node }, // score label 的引用 scoreDisplay: { default: null, type: cc.Label }, },
保存好后,我们双击MainScene打开场景,点击Canvas,在右侧的属性检查器最底部,点击[添加组件]=》[添加用户脚本组件]然后选择我们刚刚创建的脚本GAME.js。
添加好后就可以在属性检查器看到我们的属性组件来,然后我们把场景里的节点拖进对应的属性框即可实现节点绑定。不懂得可以多看看官方文档。
这样我门就可以在GAME脚本里来操作节点了。
二、创建HeroPlayer脚本用来操作玩家主角
//HeroPlayer.js cc.Class({ extends: cc.Component, properties: { //主角跳跃高度 jumpHeight: 0, //主角跳跃持续时间 jumpTimes: 0, //掉落速度 maxMoveSpeed: 0, }, //跳跃 setJumpUpAction: function(){ // 跳跃上升 var jumpUp = cc.moveBy(this.jumpTimes, cc.p(0, this.jumpHeight)); //jumpUp.reverse(); return jumpUp; }, //掉落 setJumpDownAction: function(){ //下落 var jumpDown = cc.moveBy(this.jumpTimes, cc.p(0, - this.maxMoveSpeed)); return jumpDown; }, setJumpRunAction: function(){ // 初始化跳跃动作 this.jumpAction = this.setJumpUpAction(); //掉落动作 this.maxMoveSpeed = this.setJumpDownAction(); //包装动作 var seq = cc.sequence(this.jumpAction,this.maxMoveSpeed); this.node.runAction(seq); }, //玩家不操作时,角色进行下坠 heroDownMove: function(){ //下落 var heroDown = cc.moveBy(0.8, cc.p(0, - 5)); return heroDown; }, // use this for initialization onLoad: function () { this.setJumpRunAction(); }, // called every frame, uncomment this function to activate update callback update: function (dt) { this.node.runAction(this.heroDownMove());//精灵移动 } });
角色有2种状态,一种是玩家点击屏幕会实现角色的跳跃,第二种就是角色会受到引力会自动下落。我们在update来实现自动下落。添加好方法后,我门在层级管理器中点击hero节点。然后在右侧属性检查器中绑定脚本。
我门可以在里面初始化值。跳跃高度值,跳跃持续时间,掉落速度等。
脚本里主要实现了跳跃动作,掉落动作等。
然后回到我们的游戏主脚本也就是GAME脚本。添加触摸事件监听,实现监听触摸来调用主角的跳跃动作。
首先在顶部添加脚本引用,然后创建事件监听的方法。
//GAME.js var HeroPlayer = require("HeroPlayer"); //----- //事件监听 setEventControl: function(){ var self = this; var hero = self.player.getComponent(HeroPlayer);//角色绑定控件 cc.eventManager.addListener({ event: cc.EventListener.TOUCH_ONE_BY_ONE, swallowTouches: true, // 设置是否吞没事件,在 onTouchBegan 方法返回 true 时吞没 onTouchBegan: function (touch, event) { //实现 onTouchBegan 事件回调函数 var target = event.getCurrentTarget(); // 获取事件所绑定的 target var locationInNode = target.convertToNodeSpace(touch.getLocation()); cc.log("当前点击坐标"+locationInNode); hero.node.runAction(hero.setJumpUpAction());//精灵移动 //cc.log("跳跃:--------"); return true; }, onTouchMoved: function (touch, event) { // 触摸移动时触发 }, onTouchEnded: function (touch, event) { // 点击事件结束处理 // cc.log("跳跃后角色坐标:" + self.player.getPosition() ); } }, self.node) },
然后在onload方法实现初始化调用。
onLoad: function () { //触摸监听 this.setEventControl(); // 初始化计分 this.score = 0; },
我们可以来运行下,看下效果。
本文地址:https://www.byjth.com/jixiantiaoyue/69.html
版权声明:若无注明,本文皆为“闭眼就天黑专栏_技术博客_个人学习总结”原创,转载请保留文章出处。
- CocosCreator零基础制作游戏《极限跳跃》四、添加游戏主场景控制脚本
- CocosCreator零基础制作游戏《极限跳跃》八、添加游戏积分系统
- CocosCreator零基础制作游戏《极限跳跃》六、制作游戏障碍物实现碰撞检测
- CocosCreator零基础制作游戏《极限跳跃》七、制作游戏结束场景并实现场景切换
- CocosCreator零基础制作游戏《极限跳跃》一、游戏分析
- CocosCreator零基础制作游戏《极限跳跃》二、制作游戏开始场景
- CocosCreator零基础制作游戏《极限跳跃》九、为游戏添加声音音效功能
- CocosCreator零基础制作游戏《极限跳跃》十、游戏打包发布,游戏复总结
- CocosCreator零基础制作游戏《极限跳跃》五、制作游戏主场景背景滚动
- CocosCreator零基础制作游戏《极限跳跃》三、制作游戏主场景
版权所有:《闭眼就天黑专栏_技术博客_个人学习总结》 => 《CocosCreator零基础制作游戏《极限跳跃》四、添加游戏主场景控制脚本》
本文地址:https://www.byjth.com/jixiantiaoyue/69.html
除非注明,文章均为 《闭眼就天黑专栏_技术博客_个人学习总结》 原创,欢迎转载!转载请注明本文地址,谢谢。