【Cocos Creator 】(千人群): 432818031
上一篇,介绍了Himi在使用过cc所有组件后的一篇总结,没有具体介绍每个组件的原因在于官方文档很齐全,而且也有视频的介绍。
所以希望童鞋们可以把我这两篇博文当成对组件、脚本两部分开发的整理与总结。
后续的文章,Himi应该主要更新一些官方还未补充或者还没有的教程。避免无用功。
下面直接放出代码,因为不是很难理解。所以不再一一赘述,都是常用的函数、事件监听、动作回调、定时器等开发过程中必接触的。
大致内容如下:
cc 属性介绍
获取组件的几种形式
全局变量的访问
模块之间的访问
在当前节点下添加一个组件
复制节点/或者复制 prefab
销毁节点(销毁节点并不会立刻发生,而是在当前 帧逻辑更新结束后,统一执行)
关闭监听
发射事件(事件手动触发)
动作示例,类似c2dx api 基本无变化
计时器 (component)schedule (cc.Node 不包含计时器相关 API)
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
- };