微信小游戏设计心得（四）从0到开发一款小游戏教程-岩浆救援-CocosCreator（详解1）

接上一篇微信小游戏设计心得（三）

上一篇我们杰克的头部成功移动了，第一步成功了，但是这步我们不需要了，我们在cocos里面吧这个脚本从Canvas上面删除

如图

然后我们套用c语言设计的概念，在script里面创建一个main.js ，作为我们整个小游戏的核心主脚本，把主线程序全部写在这里面，

分支程序在main.js里面调用，整个程序框架就简单明了很多

然后我们打开main.js

回想一下我们这个游戏是让杰克跳起来，越过障碍物，到一个新的位置，那么我们就要设计一个：

点击屏幕任意位置杰克跳向前方的程序

这个程序动脑想一想，需要哪些函数呢，需要哪些cocos的api呢？

1.点击屏幕的监听api （具体可以去查cocos的官方手册里面有很多种点击监听的api，我们这里是点击结束的监听）

this.node.on(cc.Node.EventType.TOUCH_END, function(event){
           
}, this)

2.节点跳跃api

 var jumpBy = cc.jumpBy(1, cc.v2(lenth, 0), 100, 1);    
        
 this.jack.runAction(jumpBy)

然后我们把这些函数运用到 main.js里面去，我会在注释里面详细解释，每一个步骤的由来

// main.js

cc.Class({
    extends: cc.Component,
    properties: {
        jack:cc.Node, //杰克这个人物的节点，我们声明出来是谁
    },
    start (){
        var self = this //我们把 this 用 self 来替换，方便子函数调用this
        //创建一个点击监听函数，self.node的意思是，这个脚本挂在谁身上这个node就是指的谁
        // TOUCH_END 是我们监听的是 点击结束
        // function(event){ xxxxx } 这是一个匿名函数，就是没有名字的函数，
        // 只需要在这个监听里面执行就这么写，假如多处用到和这个函数，可以独立成子函数
        // 然后替换成函数名就可以了，有参数要在函数名后面 +（参数），
        self.node.on(cc.Node.EventType.TOUCH_END, function(event){
            //杰克跳起来，分两个步骤
            //1.跳起来的参数，跳多高，跳多远，跳多块，我们用cc这个最大api里面的jumpBy函数去定义
            // 我们定义一个 让杰克跳跃 x坐标100 ， y坐标0，高度100，速度1的一个jumpBy
            // 去cocos手册里面看看类似于jumpBy的函数有 jumpTo 等等 一定要去看看了解一下
            var jumpBy = cc.jumpBy(1, cc.v2(100, 0), 100, 1)

            //得到了这个 jumpBy 杰克不会跳动，需要用一个执行动作的api去执行这个jumpBy
            //2.执行jumpBy， runAction 可以执行很多动作量，可以cocos手册看看
            self.jack.runAction(
                jumpBy
            )

            //3.保存，后来到cocos，把这个main脚本挂在Canvas上
            //把杰克的总节点拖入jack:cc.Node里面，然后就可以试试效果了
        }, this)
    },
});

效果

我们杰克跳起来就游戏效果就设计好了

本篇文章是说了一个杰克跳起来的脚本，关注我，或者看我的主页，找到你想要的教程

后续有：微信小游戏设计心得（x），微信小游戏设计心得（x），微信小游戏设计心得（x）···················

我会不断更新，帮助大家掌握微信小游戏基本开发流程

附上我设计的游戏二维码，试一试

看看效果如何

微信小游戏设计心得（四）从0到开发一款小游戏教程-岩浆救援-CocosCreator（详解1）

猜你喜欢