cocos2d-js 开发基础练习代码(1)——熟悉场景加载，精灵，动画使用等

cocos2d-js 开发基础练习代码(1)

个人入门练习敲代码例子：GameKernelScene.js 功能是加载个场景 layer界面随机添加些sprite从上往下掉落，超出屏幕则删除
代码涵盖内容包括：cocos2d-js场景的创建，layer的创建，sprite的创建，动画的使用，定时器的使用，以及JavaScript语法基础，对象的使用，方法的调用，数组Array的元素两种删除使用，Array添加自定义方法的方法，添加对象成员属性等。
新手一枚刚开始从c++转js，主要为了方便以后熟悉查阅，基本都是很基础的框架使用练习和js语法基础练习，看了一目了然，讲不出什么技术来，不懂欢迎评论交流
加载GameKernelScene.js方法，在入口cocos2d-js 工程下的main.js中添加启动代码： //load resources
cc.LoaderScene.preload(images_res, function () {
cc.director.runScene(new GameKernelScene());
}, this);
下章练习敲：使用事件管理器创建用户交互以及cocos精灵帧动画的js使用

/* 添加Array自定义删除方法 */
Array.prototype.DeleteByIdx = function(n) {
/* n表示索引第几项，索引从0开始计算 */
/* prototype为对象原型，注意这里为对象增加自定义方法的方法，属于JavaScript语法 */

if(n<0)
return this;
else
return this.slice(0,n).concat(this.slice(n+1,this.length));

/* concat 方法：返回一个新数组，这个新数组是由两个或更多数组组合而成的。这里
就是返回this.slice(0,n)+this.slice(n+1,this.length)组成的新数组，这中间，刚好
去掉了被删除的第n项

slice方法： 返回一个数组的一段，两个参数，分别指定开始和结束的位置。
*/
}

var GameKernelLayer = cc.Layer.extend({
// members
bgSprite:null,
SushiSpritesMgr:null,
ctor:function () {
// 1. super init first
this._super();

// init vars
//不使用自定义删除方法的Array初始化
//this.SushiSpritesMgr = [];

//使用自定义删除方法的Array初始化
this.SushiSpritesMgr = new Array();

// 2. add your contents

var size = cc.winSize;

// add btns
var closeItem = new cc.MenuItemImage(
images_res.CloseNormal_png,
images_res.CloseSelected_png,
function () {
cc.log("Z.x: Menu is clicked！");
},this);

closeItem.attr({
x:size.width - 20,
y:20,
anchorX:0.5,
anchorY:0.5
});

var menu = new cc.Menu(closeItem);
menu.x = 0;
menu.y = 0;
this.addChild(menu, 1);

// add other codes below...
// cocos label
var helloLabel = new cc.LabelTTF("Hello World", "Arial", 38);
// set position
helloLabel.x = size.width / 2;
helloLabel.y = 0;
// add node
this.addChild(helloLabel, 5);

helloLabel.runAction(
cc.spawn(
cc.moveBy(2.5,cc.p(0, size.height - 40)),
cc.tintTo(2.5, 255, 125, 0)
)
);

// cocos sprite
this.bgSprite = new cc.Sprite(images_res.GameKernel_Bg);
this.bgSprite.attr({
x: size.width / 2,
y: size.height / 2,
scale: 0.5,
rotation: 180,
anchorX: 0.5,
anchorY: 0.5
});
this.addChild(this.bgSprite, 0);

this.bgSprite.runAction(
cc.sequence(
cc.rotateTo(2, 0),
cc.scaleTo(2, 1, 1)
)
);

/* 启动定时器 */
this.schedule(this.update,1,16*1024,1);

return true;
},

addSushi: function() {

var sushi = new cc.Sprite(images_res.GameFlyBody_Image);
var size = cc.winSize;

var posX = sushi.width/2 + size.width/2*cc.random0To1();

sushi.attr({
x: posX,
y: size.height - 30
});

this .addChild(sushi, 5);
this.SushiSpritesMgr.push(sushi);

/* action */
var dorpAction = cc.MoveTo.create(4,cc.p(sushi.x, -30));
sushi.runAction(dorpAction);
},

removeSushi: function() {
/* 移除到屏幕底部的sushi */
for(var i = 0; i < this.SushiSpritesMgr.length; i++){
cc.log("Z.x: remove Sushi......");
if(0 >= this.SushiSpritesMgr[i].y){
cc.log("Z.x: remove - "+i);
this.SushiSpritesMgr[i].removeFromParent();
this.SushiSpritesMgr[i] = undefined;

//不使用自定义删除方法的Array初始化 对应上面初始化数组的语句
//this.SushiSpritesMgr.splice(i,1);
//i = i-1;

//使用自定义删除方法的Array初始化
this.SushiSpritesMgr = this.SushiSpritesMgr.DeleteByIdx(i);
}
}
},

update:function() {
/* 添加一个掉落物体 放开则添加多个*/
if(true/*0 == this.SushiSpritesMgr.length*/){
this.addSushi();
}

/* 检测掉落物体 是否超出屏幕之外 */
this.removeSushi();
}

});

var GameKernelScene = cc.Scene.extend({
onEnter:function () {
this._super();

var layer = new GameKernelLayer();
this.addChild(layer);
}
});