通过一个多月来对cocos creator 的学习,通过对项目的学习,总结一些有用的只是点
1.开始不知道多个同样的对象是怎么样排序的。比如麻将的十四章牌,通过代码查看才恍然大悟,原来是根据节点树的排列顺序定位的。。
2.组件式开发,一开始特别不适应,通过对应学习,发现特别好用,每个节点都可以添加组件,组件上可以关联js文件中的代码功能逻辑,组件可以是系统的,也可以是自己拼的
preference,也可以是js文件类。
3.根节点是canvas,这个一个场景的根节点,对应项目是,一个场景的所有的功能全部添加在根节点上,然后在这个大场景又有好多小界面,通过active来控制显隐。这样的好处是方便管理。然后在canvas绑定的组件js文件类里面添加各个模块对应的功能js文件。
4.学习的工程不能只看js。要结合每个场景绑定的js,以及界面上的各个组件关系,根据组件来查找对应的功能。
5.功能的逻辑,跟cocos还是很像的。
6.手动创建一个按钮的Button事件
找到canvas上的节点。cc.find ::var node = cc.find("Canvas/btn_zhanji");
this.addClickEvent(node, this.node, "History", "onBtnHistoryClicked");
addClickEvent:function(node, target, component, handler){
var eventHandler = new cc.Conpent.EventHandler();
eventHandler.target = target;
eventHandler.component = component;
eventHandler.hanlder = handler;
var clickEvents = node.getComponent(cc.Button).clickEvents;
clickEvent.push(eventHandler);
}
7.创建可滑动的视图
this._viewlist = this._history.getChildByName("viewlist");
this._content = cc.find("view/content",this._viewlist);
this._viewitemTemp = this._content.children[0];
this._content.removeChild(this._viewitemTemp);
分析一下这几句代码,不难理解,首先scrollview是预先添加到canvas里面的,content也是预先添加到界面的,然后在这个界面的content上又添加了一个Item的组件。
在进行初始化的时候,首先获取到这个item组件,然后在从content上删除掉这个多余的item组件。再在下面的逻辑,根据数据的多少显示对应的item个数,这个应用还是挺巧妙的!
首先在添加Item数据的时候,先用sort方法,根据时间的大小来排序。然后就是根据一个个item的特点添加每一item的数据
initGameHistoryList:function(roomInfo,data){
data.sort(function(a,b){
return a.create_time < b.create_time;
});
for(var i = 0; i < data.length; ++i){
var node = this.getViewItem(i); //关键代码,获取item的组件,这里面还有一个操作就是限定item个数。
var idx = data.length - i - 1;
node.idx = idx;
var titleId = "" + (idx + 1);
node.getChildByName("title").getComponent(cc.Label).string = titleId;
node.getChildByName("roomNo").getComponent(cc.Label).string = "房间ID:" + roomInfo.id;
var datetime = this.dateFormat(data[i].create_time * 1000);
node.getChildByName("time").getComponent(cc.Label).string = datetime;
var btnOp = node.getChildByName("btnOp");
btnOp.idx = idx;
btnOp.getChildByName("Label").getComponent(cc.Label).string = "回放";
var result = JSON.parse(data[i].result);
for(var j = 0; j < 4; ++j){
var s = roomInfo.seats[j];
var info = s.name + ":" + result[j];
//console.log(info);
node.getChildByName("info" + j).getComponent(cc.Label).string = info;
}
}
this.shrinkContent(data.length);
this._curRoomInfo = roomInfo;
},
getViewItem:function(index){
var content = this._content;
if(content.childrenCount > index){
return content.children[index];
}
var node = cc.instantiate(this._viewitemTemp);//获取到这个组件
content.addChild(node);
return node;
},
日期格式2016--12--10 10:30:03
dateFormat:function(time){
var date = new Date(time);
var datetime = "{0}-{1}-{2} {3}:{4}:{5}";
var year = date.getFullYear();
var month = date.getMonth() + 1;
month = month >= 10? month : ("0"+month);
var day = date.getDate();
day = day >= 10? day : ("0"+day);
var h = date.getHours();
h = h >= 10? h : ("0"+h);
var m = date.getMinutes();
m = m >= 10? m : ("0"+m);
var s = date.getSeconds();
s = s >= 10? s : ("0"+s);
datetime = datetime.format(year,month,day,h,m,s);
return datetime;
},