Cocos Creator 学习笔记(二)

随后几天我们学习了Cocos Creator官方文档中的一个坑爹小游戏

Cocos Creator 学习笔记(二)_第1张图片

这是我们的第一个主角。运行游戏发现,主角跳跃频率偏快,高度太高,星星出现的位置太高而且超出了画布。

先从人物入手,在人物节点的属性检查器中找到用户自定义脚本组件,点击脚本,顺着提示打开脚本文件。

JS文件中有几个方法需要记录一下(个人理解,可能有错误):

在该脚本挂载的节点被加载时,脚本中的onLoad函数会首先被执行,随后是start函数;在节点加载完毕后update函数会根据设置的帧率自动刷新画面; onDestory函数则会在节点销毁的时候自动调用。

在游戏设定中,purperMonster是会一直跳跃的,因此先为其创建一个控制跳跃的函数。

具体实现部分官方已经给出了。

setJumpAction: function () {
        // 跳跃上升
        var jumpUp = cc.moveBy(this.jumpDuration, cc.v2(0, this.jumpHeight)).easing(cc.easeCubicActionOut());
        // 下落
        var jumpDown = cc.moveBy(this.jumpDuration, cc.v2(0, -this.jumpHeight)).easing(cc.easeCubicActionIn());
        // 不断重复
        return cc.repeatForever(cc.sequence(jumpUp, jumpDown));
    },

值得解释一下的是cc.moveBy这个API,它的第一个参数是跳跃间隔时间,第二个参数是一个cc.v2对象,也就是需要到达的位置。后半部分的.easing,是用来控制移动速度曲线的,为了让跳跃更像跳跃。

onLoad: function () {
        // 初始化跳跃动作
        this.jumpAction = this.setJumpAction();
        this.node.runAction(this.jumpAction);

        // 加速度方向开关
        this.accLeft = false;
        this.accRight = false;
        // 主角当前水平方向速度
        this.xSpeed = 0;

        // 初始化键盘输入监听
        cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.onKeyDown, this);
        cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, this.onKeyUp, this);   
    },

在这段代码中,设置了键盘的监听,据官方文档中描述,cc.systemEvent目前支持按键事件和重力感应事件。

cc.systemEvent.on的第一个参数是系统时间类型,第二个是监听到该事件发生后的回调函数(这里是自定义的onKeyDown和onKeyUp函数),第三个参数是监听目标,可以是null

update: function (dt) {
        // 根据当前加速度方向每帧更新速度
        if (this.accLeft) {
            this.xSpeed -= this.accel * dt;
        } else if (this.accRight) {
            this.xSpeed += this.accel * dt;
        }
        // 限制主角的速度不能超过最大值
        if (Math.abs(this.xSpeed) > this.maxMoveSpeed) {
            // if speed reach limit, use max speed with current direction
            this.xSpeed = this.maxMoveSpeed * this.xSpeed / Math.abs(this.xSpeed);
        }

        // 根据当前速度更新主角的位置
        this.node.x += this.xSpeed * dt;
    },

这里的this.accel是通过参数列表在属性检查器中设置的,方便后期改动。

 

Game.js是一个统筹全局的角色,它控制了整个游戏的运行、暂停、结束、开始。在ccc中,可以将节点挂载到脚本上来获取该节点的内部信息。

如果其他脚本需要控制全局,可通过构造一个init函数把game传递给该脚本,这样该脚本就可以使用game.js中的资源。

比如这样:

init: function (game) {
        this.game = game;
    },

在game.js中,可在onLoad中调用该脚本中的init函数,同时将自身(this)传入该函数。

 

为了让purperMonster的跳跃更加有弹性,官方例子中为其加上了形变的效果

setJumpAction: function () {
        // 跳跃上升
        var jumpUp = cc.moveBy(this.jumpDuration, cc.v2(0, this.jumpHeight)).easing(cc.easeCubicActionOut());
        // 下落
        var jumpDown = cc.moveBy(this.jumpDuration, cc.v2(0, -this.jumpHeight)).easing(cc.easeCubicActionIn());
        // 形变
        var squash = cc.scaleTo(this.squashDuration, 1, 0.6);
        var stretch = cc.scaleTo(this.squashDuration, 1, 1.2);
        var scaleBack = cc.scaleTo(this.squashDuration, 1, 1);
        // 添加一个回调函数,用于在动作结束时调用我们定义的其他方法
        var callback = cc.callFunc(this.playJumpSound, this);
        // 不断重复,而且每次完成落地动作后调用回调来播放声音
        return cc.repeatForever(cc.sequence(squash, stretch, jumpUp, scaleBack, jumpDown, callback));
    },

cc.sequence 顺序执行动作,创建的动作将按顺序依次运行。

 

你可能感兴趣的:(Cocos Creator 学习笔记(二))