【Cocos Creator教程】——蜗牛过桥（

初学Cocos Creator，做了个小游戏与大家分享

在线体验：（IE10可行，360浏览器可能会有问题，其它浏览器自测）

http://1.snailgo.applinzi.com（PC端）

http://2.snailgo.applinzi.com （移动端）

源码下载：https://download.csdn.net/download/lzq603/10274574

1.     创建以下文件夹，新建一个场景game_scene，并将图片、字体资源导入。

2.     设置Canvas大小为720x1280，

新建单色节点bg，设置大小为720x1280

新建空节点map，在map下新建单色节点ground1，颜色改为黑色，锚点设置为（1，1），并调整大小360x640，如图：

将资源中的Snail拖至Canvas上创建Sprite节点，锚点设置为（0.5，0），并平移到合适位置，如图

在Canvas节点下创建2个Button节点（删掉下面自动生成的Label节点），分别命名为start_btn与restart_btn，点击按钮节点，将res下其他三个图片资源分别拖拽至按钮控件对应位置上，例如：点击start_btn节点，将res中start_btn图片拖至下图Normal上。

设置大小模式：

然后调节他们的大小、位置，此时，界面如下：

3.     在scripts文件夹内新建javascripts脚本game_scene，修改代码如下：

cc.Class({
    extends: cc.Component,

    properties:{
        status:0,       //游戏状态，0:等待用户触屏   1:玩家触屏    2:玩家手指离开屏幕    3:播放游戏动画中，禁止玩家操作
        startBtn:{      //为方便访问开始按钮，在此添加开始按钮节点
            type:cc.Node,
            default:null,
        }
    },

    // onLoad () {},

    start () {
        this.node.on("touchstart",function(e){      //触屏事件

        },this);
        this.node.on("touchend",function(e){       //触屏结束事件

        },this);
    },

    gameStart(){       //游戏开始
        this.startBtn.destroy();    //销毁开始按钮，不再让它显示
    },
    // update (dt) {},
});

点击Canvas节点——添加组件——添加用户脚本组件——game_scene（就是刚刚写的脚本），把按钮添加在这个组件上：

4.给start_btn按钮添加一个事件：

4.再添加一个Label节点，用来显示分数：

游戏开始之前，我们不让它显示，在属性检查器中将它之前的勾去掉：

至此，游戏的基本场景我们已经布置好了，接下来我们开始写代码控制游戏进行。