【COCOS CREATOR 系列教程之二】脚本开发篇&事件监听、常用函数等示例整合

【Cocos Creator 】(千人群): 432818031

上一篇，介绍了Himi在使用过cc所有组件后的一篇总结，没有具体介绍每个组件的原因在于官方文档很齐全，而且也有视频的介绍。

所以希望童鞋们可以把我这两篇博文当成对组件、脚本两部分开发的整理与总结。

后续的文章，Himi应该主要更新一些官方还未补充或者还没有的教程。避免无用功。

下面直接放出代码，因为不是很难理解。所以不再一一赘述，都是常用的函数、事件监听、动作回调、定时器等开发过程中必接触的。

大致内容如下：

1. cc 属性介绍

2. 获取组件的几种形式

3. 全局变量的访问

4. 模块之间的访问

5. 在当前节点下添加一个组件

6. 复制节点/或者复制 prefab

7. 销毁节点(销毁节点并不会立刻发生，而是在当前 帧逻辑更新结束后，统一执行)

8. 事件监听 on 4种形式（包括坐标获取）

9. 关闭监听

10. 发射事件（事件手动触发)

11. 动作示例，类似c2dx api 基本无变化

12. 计时器 (component)schedule (cc.Node 不包含计时器相关 API)

13. url raw资源获取

CC版本：0.7.1

源码下载地址: http://vdisk.weibo.com/s/yZxRoLm4Mnio3

主要两个js源码:

HelloWorld.js

cc.Class({
extends:cc.Component,properties:{
label:{
default:null,type:cc.Label
},text:'Hello,World!',t_prefab:{
default:null,type:cc.Prefab
},t_sprite:{//定义一个cc的类型，并定义上常用属性
default:null,type:cc.SpriteFrame,//类型的定义
//url:cc.Texture2D,//RawAsset(cc.Texture2D,cc.Font,cc.AudioClip)
visible:true,//属性检查器中是否可见
displayName:'himi',//属性检查器中属性的名字
tooltip:"测试脚本",//属性检查器中停留此属性名称显示的提示文字
readonly:false,//属性检查器中显示（readonly）且不可修改[当前有bug，设定只读也能修改]
serializable:true,//设置false就是临时变量
editorOnly:false//导出项目前剔除此属性
},t_url:{
default:null,url:cc.Texture2D
},t_count_2:200,//基础类型

//可以只定义get方法，这样相当于一份readonly的属性。[当前有bug，只设定get也能修改]
t_getSet:{
default:12,get:function(){returnthis.t_getSet},//get
set:function(value){this.t_getSet=value;}//set
},t_array:{//定义一个数组
default:[],type:[cc.Sprite]
}
},//usethisforinitialization
onLoad:function(){

//--->>>获取组件的几种形式:
//1.通过属性检查器被赋值的label组件，直接拿到得到实例
//2.通过属性检查器被赋值的label组件所在的node节点，然后通过getComponent获取
//this.label.string=this.text;

//3.获取当前this(node)节点上的label组件
//var_label=this.getComponent(cc.Label);

//4.先获取目标组件所在的节点，然后通过getComponent获取目标组件
var_label=cc.find("Canvas/label").getComponent(cc.Label);

//5.也可以如下形式【注意此种方式，目前有BUG，无法正常使用(0.7.1)】
//var_label=cc.find("Canvas/label<cc.Label>");

console.log(_label.string);
console.log(this.t_getSet);

//--->>>全局变量的访问
/*任意脚本中定义如下：【注意不要有var哦】

t_global={
tw:100,th:200
};

*/
t_global.th=2000;
console.log(t_global.th);

//--->>>模块之间的访问
/*任意脚本中定义如下【注意关键字是module.exports】

module.exports={
tme_pa1:"100",tme_pa2:333221
};

*/
//--->>>用require+文件名(不含路径)来获取到其他模块的对象
vartModuleData=require("testJs");
tModuleData.tme_pa2=991;
console.log(tModuleData.tme_pa2);


//--->>>在当前节点下添加一个组件
varmySprite=newcc.Node().addComponent(cc.Sprite);
mySprite.spriteFrame=this.t_sprite;
mySprite.node.parent=this.node;
mySprite.node.setPosition(300,200);


//--->>>复制节点/或者复制prefab
//复制节点
varlLabel=cc.instantiate(this.label);
lLabel.node.parent=this.node;
lLabel.node.setPosition(-200,0);
//复制prefab
vartPrefab=cc.instantiate(this.t_prefab);
tPrefab.parent=this.node;
tPrefab.setPosition(-210,100);


//--->>>销毁节点(销毁节点并不会立刻发生，而是在当前帧逻辑更新结束后，统一执行)
if(cc.isValid(this.label.node)){
console.log("有效存在，进行摧毁");
this.label.destroy();
}else{
console.log("已摧毁");
}

//--->>>事件监听on4种形式
//枚举类型注册
vartFun=function(event){
console.log("touchendevent:"+event.touch.getLocation().x+"|"+event.touch.getLocation().y);
};
this.node.on(cc.Node.EventType.TOUCH_END,tFun,this);

//事件名注册
//vartFun=function(event){
//console.log("touchendevent");
//};
//this.node.on("touchend",tFun);

//this.node.on("touchend",function(event){
//console.log("touchendevent");
//});

//this.node.on("touchend",function(event){
//console.log("touchendevent");
//},this);

//this.node.on("touchend",function(event){
//console.log("touchendevent");
//}.bind(this));

//--->>>一次性的事件监听once
//this.node.once("touchend",function(event){
//console.log("touchendevent");
//});


//--->>>关闭监听
this.node.off("touchend",this);


//--->>>发射事件（事件手动触发)
this.node.on("tEmitFun",function(event){
console.log("tEmitFunevent:"+event.detail.himi+"|"+event.detail.say);

//-->>>事件中断,如下函数阻止事件向当前父级进行事件传递
//event.stopPropagation();
});
this.node.emit("tEmitFun",{himi:27,say:"hello,cc!"});


//--->>>动作，类似c2dxapi基本无变化
varmTo=cc.moveBy(1,-100,-200);
varmAction=cc.repeatForever(cc.sequence(cc.moveBy(1,-200),mTo.reverse(),cc.delayTime(0.5),cc.callFunc(function(action,data){
console.log("actioncallback:"+data.himi);
},this,{tx:100,himi:"i'mactioncallbackandbringdata"})));
mySprite.node.runAction(mAction);
//暂停动作
mySprite.node.stopAction(mAction);


//--->>>计时器(component)schedule(cc.Node不包含计时器相关API)
//参数：callfuntion/interval/repeattimes/delaytime
//不延迟，永久重复
this.schedule(function(){
console.log("schedulelog...");
},1);

//不延迟，有重复次数限定
//this.schedule(function(){
//console.log("schedulelog...");
//},1,2);

//重复2次，重复间隔为1秒，延迟1秒进行
//this.schedule(function(){
//console.log("schedulelog...");
//},2,1);

//一次性的计时器
varmySch=function(){console.log("scheduleOncelog...");}
this.scheduleOnce(mySch);

//取消定时器
this.unschedule(mySch);


//--->>>urlraw资源获取
varmSf=newcc.Node().addComponent(cc.Sprite);
mSf.spriteFrame=this.t_sprite;
mSf.spriteFrame.setTexture(this.t_url);
mSf.node.setPosition(400,0);
mSf.node.parent=this.node;
mSf.node.setScale(0.5);

//获得RawAsset的url
varmUrl=cc.textureCache.addImage(cc.url.raw("himi.png"));
console.log("rawasseturl:"+mUrl);


},//calledeveryframe
update:function(dt){
//if(cc.isValid(this.label.node)){
//console.log("有效存在，进行摧毁");
//}else{
//console.log("已摧毁");
//}
},});

testJs.js

t_global={
tw:100,th:200
};

module.exports={
tme_pa1:"100",tme_pa2:333221
};