用cocos creator制作一个小游戏

首先我们建一个空项目,进去后建立一个文件夹scenes,用来存放场景, 然后右键选择创建一个scene

image.png

接下来, 创建一个res目录,把我们需要的资源丢进去.

image.png
然后双击scenes文件夹下的game场景, 来编辑它, 进入场景后创建一个空节点sky,用来展示天空
image.png

然后在sky节点下创建一个子节点sky1,再将锚点Anchor设置为(0,0),然后设置位置Position(0,400),

image.png

然后选中sky1, 将bg拖到右侧的Sprite Frame中, 再将锚点Anchor设置为(0,0),
再复制一个节点命名为sky2, 设置位置Position(900,0),如下图:

image.png

创建scrips文件夹用来存放脚本,创建Scroller来控制sky.并将Scroller脚本添加到sky节点组件中,如下图:

image.png

Scroller脚本代码如下, speed是每秒走的距离, resetX是重置的位置

cc.Class({
    extends: cc.Component,

    properties: {
        //-- 滚动的速度
        speed: 0,
        //-- X轴边缘
        resetX: 0
    },

    update :function (dt) { // dt约为0.01667, 1秒钟60dt.
        if(D.gameController.state != Global.State.Run)
            return ;
        let x = this.node.x;
        this.node.x += this.speed*dt;
        if(x <= this.resetX) {
            this.node.x -= this.resetX;
        }

    }
});

这俩个值可以在cocos creator编辑.

image.png

按照创建sky的方式来创建ground

image.png

然后我们创建不动的背景块

image.png
设置颜色, 锚点, 位置
image.png

然后以同样的方式创建蓝色的背景块

image.png

到这里背景就创建完成了. 效果预览: http://47.94.11.138/demo/flybird1/build/index.html