美文网首页红红火火恍恍惚惚
CocosCreator教程(初识篇)

CocosCreator教程(初识篇)

作者: 简栋梁 | 来源:发表于2019-06-14 17:03 被阅读0次

目录
一、定义
二、安装
三、开发一个小Demo

系列教程
CocosCreator教程(编辑器篇)
CocosCreator教程(入门篇)


一、定义

以内容创作为核心的,一体化游戏开发工具,降低游戏开发门槛。


二、安装

1、官网地址:www.cocos.com
2、步骤

(1)下载推荐版本

(2)一路next,安装成功后,注册账号

(3)打开hello world模板项目

(4)运行项目

(5)更改素材后,再次运行项目


三、开发一个小Demo

1、创建空白项目
2、手动创建目录结构
3、添加内容(需要一张图片,以及右击文件夹创建脚本、场景文件)
4、双击场景文件,进入场景,并添加图片,到场景图层中
5、编辑脚本

(1)双击.js文件,会出现警告,引导用户关联IDE

(2)再次打开脚本文件,使用指定的IDE编辑代码

(3)粘贴、替换代码

cc.Class({
    extends: cc.Component,

    properties: {
        durationJump: 1,
        heightJump: 300
    },

    actionJump() {
        //moveBy()——移动到指定位置
        //p()——坐标
        //easing()——运动曲线
        //easeCubicActionOut/easeCubicActionIn——运动曲线预设
        //repeatForever()——循环动作队列
        //sequence()——创建动作队列

        //动作
        const up = cc.moveBy(this.durationJump, cc.p(0, this.heightJump)).easing(cc.easeCubicActionOut())
        const down = cc.moveBy(this.durationJump, cc.p(0, -this.heightJump)).easing(cc.easeCubicActionIn())

        //动画
        return cc.repeatForever(cc.sequence(up, down))
    }

    // LIFE-CYCLE CALLBACKS:

    onLoad () {
        this.node.runAction(this.actionJump())
    },

    start () {

    },

    // update (dt) {},
});

6、在属性检查器中,添加用户脚本组件

PS:界面中,每个模块的元素,基本都可以使用拖拽的方式,进行元素的跨模块交互。(如:将资源管理器中的bird.js,拖拽到angry_bird节点的属性检查器内,以代替上图的操作)

7、运行成功

相关文章

网友评论

    本文标题:CocosCreator教程(初识篇)

    本文链接:https://www.haomeiwen.com/subject/ottqfctx.html