cocoscreator使用说明
索引
- 开始
- 使用说明
- 注意事项
- js脚本概况
- js脚本场景切换，常驻节点
- 平台使用，全局使用
- 在脚本中添加组件(渲染组件、UI组件):
- 在脚本中获取组件：
- 使用附加
- 节点系统事件
- websoct
- 项目结构
- 子系统重点
- 对象池
- 声音和音效
- 多分辨率适配方案
- 结束
开始
使用说明
文件-新建场景-保存
层级管理器-Canvas右键-创建节点
资源管理器-文件夹右键-新建-文件夹/JavaScript
属性检查器[Canvas]-添加组件-用户脚本组件/UI组件/
属性检查器[事件]-ClickEvents-脚本拖拽到Node-
注意事项
注意锚点：用于变化、子节点定位基准
标准网络接口:
XMLHttpRequest,短连接；WebSocket长连接；
计时器：
this.schedule(fn, interval, repeat, delay)
this.schedule(fn)
//interval, 以秒为单位的时间间隔 //delay, 开始延时
动作系统：
var finished = cc.callFunc(fn, target, arg);
var action = cc.scaleTo(0.5, 2, 2);
//使用easeIn曲线，丰富动作变现
action.easing(cc.easeIn(3.0))
//ps,可以使用欢动系统，代替动作系统。欢动系统的api更简约
js脚本概况
cc.Class({
extends: cc.Component,
properties:{
temp_spr:cc.Sprite,
target:{
default:null,
type:cc.Node,
},
},
onLoad() {},
start() {},
update(dt) {}, //动画前
//另一种写法 onLoad: function(){},
lateUpdate(dt) {}, //动画后
onDestroy() {}, //当组件或者所在节点调用了 destroy()时
onEnable() {}, //当组件的 enabled 属性从 false 变为 true 时，或者所在节点的 active 属性从 false 变为 true 时
（倘若节点首次被创建且 enabled 为 true，则会在 onLoad 之后，start 之前被调用）
onDisable() {}, //当组件的 enabled 属性从 true 变为 false 时，或者所在节点的 active 属性从 true 变为 false 时
});
js脚本场景切换，常驻节点
var scene = cc.director.getScene();
//从当前场景，切换到MyScene场景
cc.director.loadScene("MyScene");
//fn：加载MyScene场景时触发, 加载场景回调
cc.director.loadScene("MyScene", fn);
//后台预加载场景
cc.director.preloadScene("MyScene", fn);
//通过常驻节点，进行场景资源管理和参数传递
//常驻节点：不随场景切换，而自动销毁，为所有场景提供持久性信息
//设置常驻节点
cc.game.addPersistRootNode(myNode);
//取消常驻节点，还原为一般场景节点
cc.game.removePersistRootNode(myNode);
平台使用，全局使用
if(!cc.sys.isNative && cc.sys.isMobile){
var cvs = this.node.getComponent(cc.Canvas);
cvs.fitHeight = true;
cvs.fitWidth = true;
}
//cc.vv 命名空间，全局
var GameNetMgr = require("GameNetMgr");
cc.vv.gameNetMgr = new GameNetMgr();
var onGet = function(ret) {};
var data = { account:1, sign:2, };
cc.vv.http.sendRequest('/get_user_status', data, onGet.bind(this));
var btn = cc.find(btnPath);
cc.vv.utils.addClickEvent(btn, this.node, 'Hall', 'onBtnClicked');
在脚本中添加组件(渲染组件、UI组件):
js properties中添加，temp_spr:cc.Sprite
创建节点，拖拽到temp_spr中，或者直接在js中创建和赋值
cc.Class({
extends:cc.Component,
properties:{
sprite:{
default:null,
type:cc.SpriteFrame,
},
target:{
default:null,
type:cc.Node,
},
target_prefab:{
default: null,
type: cc.Prefab,//预设
}
},
start:function(){
//动态创建节点，并加入到场景中
var node = new cc.Node('Sprite')
var sp = node.addComponent(cc.Sprite);
sp.SpriteFrame = this.sprite
node.parent = this.node;
//克隆场景中的已有节点
var scene = cc.director.getScene();
var node = cc.instantiate(this.target);
node.parent = scene;
node.setPosition(0, 0);
//创建预设节点和 克隆节点 相同
//5s后，销毁节点并不会立刻被移除，而是在当前帧逻辑更新结束后，统一执行
setTimeout(function(){
this.target.destroy();
}.bind(this), 5000);
update:function(dt) {
//判断当前节点是否已经被销毁
if (cc.isvalid(this.target)) {
this.target.rotation += dt * 10.0;
}
}
//ps不要使用removefromparent销毁节点，调用后，它不一定就能完全从内存中释放，
因为有可能存在一些逻辑上的问题，导致程序中仍然引用到了这个对象。
}
})
在脚本中获取组件：
获得组件所在的节点，this.node
获取其他组件，this.getComponent(组件名)
获取其他节点及其组件
返回子节点数组 this.node.children
返回对应的子节点 this.node.getChildren('子节点名')
查找后代节点 cc.find('子节点/.../后代节点', this.node)
全局查找节点 cc.find('场景/节点/节点/...');
访问已有变量里的值 （通过模块访问）
专门开设一个中介模块，导出接口；在其他模块进行节点、组件、属性的操作
//Global.js
module.exports =
{
backNode:null,
backLabel:null,
};
//Back.js
var Global = require("Glocal")
cc.Class({
extends:cc.Component,
onLoad: function()
{
Global.backNode = this.node,
Glocal.backLabel = this.getComponent(cc.Label),
}
});
//AnyScript.js
var Global = require("Glocal")
cc.Class({
extends: cc.Component,
start: function(){
var text = "Back";
Global.backLabel.string = text;
}
})
使用附加
节点系统事件
//全局系统事件的类型
cc.SystemEvent.EventType.KEY_DOWN //键盘按下
cc.SystemEvent.EventType.KEY_UP //键盘按下
cc.SystemEvent.EventType.DEVICEMOTION //设备重力传感
//绑定、解除全局系统事件
cc.SystemEvent.on(event, fn, target, boolean);
cc.SystemEvent.off(event, fn, target, boolean);
//鼠标事件类型和事件对象
mousedown cc.Node.EventType.MOUSE_DOWN
mouseenter
mousemove
mouseleave
mouseup
mousewheel
//函数名
getScrollY Number 获取滚轮的Y轴距离
getLocation Object 获取鼠标位置对象，对象包含x和y属性
getPreviousLocation Object 获取鼠标事件上次触发时的位置对象
getDelta Object 获取鼠标距离上一次时间移动的距离对象，包含xy
getButton Number cc.Event.EventMouse.BUTTON_LEFT/RIGHT/MIDDLE
//触摸事件类型和事件对象
cc.Node.EventType.TOUCH_START/MOVE/END/CANCEL
touchstart touchmove touchend touchcancel
//函数名
getStartLocation 获取触摸起始时
//其他事件
position-changed 位置修改时
rotation-changed
scale-changed
size-changed
anchor-changed
//ps,没加对象定义、事件名等价，在回调参数中，作用相同.
websoct
var ws = new WebSocket("ws://localhost:8080/");
ws.onopen = function (event) {
console.log("Send Text WS was opened.");
var jsonTab = {
cmd:"login",
name:"value",
gender:"male",
headurl:"www.baidu.com",
unionid:"unionid_2",
};
var jsonStr = JSON.stringify(jsonTab);
ws.send(jsonStr);
};
ws.onmessage = function (event) {
console.log("response text msg: " + event.data);
var jsonTab = JSON.stringify(event.data);
if (jsonTab.cmd == "login") {
}
if (jsonTab.cmd == "ranking") {
}
if (jsonTab.cmd == "setinfo") {
}
};
ws.onerror = function (event) {
console.log("Send Text fired an error");
};
ws.onclose = function (event) {
console.log("WebSocket instance closed.");
};
项目结构
assets: 与资源管理器同步，游戏的核心目录（每个文件都有相应.meta文件）
library： 文件的结构和资源格式 将被处理成最终游戏发布时需要的形式
local：编辑器使用习惯记录
packages
settings：项目设置
temp
project.json：版本控制，必须与assets共存
build：打包到处项目，构建项目时，自动生成
PS:.meta文件，记录某资源在项目中的唯一标识，以及其配置信息，只有在编辑器中对资源做修改，.meta文件才会变化。
因此，不要在编辑器外，对资源的内容进行操作。
子系统重点
渲染系统：对摄像机、渲染组件的了解
UI系统：对widget/layout等UI组件的了解
动画系统：创建动画的基本流程，
时间曲线（双击动画线，进入编辑窗口），
时间管理（双击游标，加减按钮控制参数个数），
脚本控制
物理引擎：碰撞组件***
音频系统：audioSource组件，脚本控制
对象池
对象池的概念
在同一场景中，需要多次进行节点的生成、消失时，假如直接进行创建、销毁的操作，就会很浪费时间。
因此，使用对象池，存储需要消失的节点，释放需要生成的节点，达到节点回收利用的目的。
工作流程
properties:{
enemyPrefab: cc.Prefab //准备预支资源
},
onLoad:function(){
this.enemyPool = new cc.NodePool();
let initCount = 5;
for (let i = 0; i < initCount; ++i) {
let enemy = cc.instantiate(this.enemyPrefab); //创建节点
this.enemyPool.put(enemy); //通过put接口放入对象池
}
}
createEnemy:function(parentNode) {
let enemy = null;
if (this.enemyPool.size() > 0) { //通过size接口 判断对象池中是否有空闲的对象
enemy = this.enemyPool.get();
} else { //如果没有空闲对象，也就是对象池中备用对象不够时，我们就用cc.instantiate重新创建
enemy = cc.instantiate(this.enemyPrefab);
}
enemy.parent = parentNode; //将生成的敌人加入节点树
enemy.getComponent('Enemy').init(); //接下来就可以调用enemy身上的脚本进行初始化
}
onEnemyKilled:function(enemy){
//enemy 应该是一个 cc.Node
this.enemyPool.put(enemy);//和初始化方法一样，将节点放入对象池，这个方法会同时调用节点的removeFromParent
}
//清除对象池
//手动清空对象池，销毁其中缓存的所有节点
myPool.clear()
声音和音效
AudioSource 属于组件，播放音频
this.audioSource.play()
this.audioSource.pause()
AudioEngine 纯API, 播放音频
audio:cc.AudioClip //定义一个Audio资源对象
this.current=cc.audioEngine.play(this.audio,false,1);
cc.audioEngine.stop(this.current);
以上两种，都可以播放声音和音效