常用的API(对开发之旅书上的一些具体步骤的总结)

1、常用API总结：（参考开发之旅书上用的一些API，详细参考书上代码）1.格式化输出方法：对格式要求高，可能因为参数格式问题出错:cc.log /如cc.log(%d js,5);输出为5 js推荐自己写一个类似Java中System.out.print()方法，如书中给的：var trace = function() cc.log(Atotype.join.call(arguments,); /有了这个方法，之后就可以实现如trace(hello+world);的输出this/varname.addChild:var layer = new helloworldlayer（）；

2、this.addChild(layer);或scene.addChild(layer);/可添加一个图层到场景中并显示cc.director.getWinsize();var size =cc.director.getWinsize();size即存有游戏的显示屏幕（世界坐标系）的宽和高new cc.Sprite(res);var bg =new cc.Sprite(res.helloworld_png);/创建一个精灵，精灵以图helloworld呈现size.widthsize.height取宽的大小，高的大小cc.director.runScene(); /括号内加场景，即可执行场景里的

3、内容cc.director.runScene(new cc.TransitionSlideInT(2,new SecondScene();/两秒后滑动切换场景到ScondScene类似的切换场景效果：TransitionMoveInB:从下往上移进TransitionRotoZoom:旧旋转变小消失，新旋转变大出现TransitionJumpZoom:旧缩小再跳跃离开，新跳跃进入TransitionShrinkGrow:旧变小，新逐渐变大TransitionFlipX:旧横向旋转，新出现TransitionFlipAngular:旧斜向旋转TransitionFade:旧逐渐消失，新逐渐显示T

4、ransitionTurnOffTiles:新场景直接出现在背后，旧场景马赛克方式逐渐消失TransitionSplitCols:画面分三列分别滑进滑出pushScene不销毁场景，把上个场景存起来popScene当前场景销毁，回到上一个场景前缀cc.director.后缀：getWinsize窗口的设计尺寸 getVisiblesize窗口实际尺寸 getScheduler获取全局定时器 pause/resume暂停/恢复场景节点Node（如图层layer，精灵sprite均为节点）下实现每一帧做点小动作：scheduleUpdate和update如在自己构造的图层对象layer中的ctor

5、（自编构造函数)加入this.scheduleUpdate();在ctor函数下再加个update函数（官方原生函数），函数内容自编，scheduleUpdate通知当前节点在每帧重绘前调用update函数1.动作:cc.moveBy(1,cc.p(size.width,100);直线移动一秒，且一秒后，宽移动一个屏宽的像素，高向上移动100像素。cc.moveTo(1,cc.p(size.width,100);直线移动一秒，且一秒后，移动到坐标为(size.width,100)cc.scaleTo(1,2,2);一秒后放大对象宽为原来两倍，高为原来两倍cc.fadeOut(2); /两秒淡出

6、cc.fadeIn(2); /两秒淡入cc.blink(2,10); /两秒闪烁10次cc.color(100,0,0); /设置颜色红色为100，绿色为0，蓝色为0cc.tintTo(2,100,0,0); /两秒内颜色变化为（100,0,0）cc.sequence(action1,action2); /顺序执行两个动作，一个动作结束就开始执行另一个动作, 串行执行，这整个语句可以赋值给另一个动作cc.repeat(action,5);/重复执行action5次cc.repeatForever(action);/无限重复执行actioncc.spawn(action1,action2);/同

7、时执行多个动作，并行执行action.reverse();/ 代表action动作的反动作示例：var ball=new cc.Sprite(res.helloworld.png);var action=cc.scaleTo(1,2,2);一秒后放大对象宽为原来两倍，高为原来两倍ball.runAction(action)；球执行动作action缓动方式action.easing(cc.easeIn(2);/以二次方加速移动action.easing(cc.BounceIn(2);/弹性加速action.easing(cc.easeQuadraticAcitonIn/Out/InOut();二

8、次曲线的速度变化形式移动action.easing(cc.easeCubicAcitonIn/Out/InOut();三次曲线的速度变化形式移动action.easing(cc.easeBackAcitonIn/Out/InOut();出去再返回弹性和反弹action.easing(cc.easeElasticIn/Out/InOut();action.easing(cc.easeBounceIn/Out/InOut();控制动作：node.stopAction(action);/停止node的action动作node.stopActionByTag(tag);/通过标签来判断node应停止的

9、某些动作node.stopAllAction();/停止node的所有动作cc.director.pause();/游戏全暂停cc.director.resume();/游戏全恢复动作ball.pause();/球停止动作ball.resume();/球恢复动作监听动作开始和结束cc.callFunc(callback,ball,message);在球动作执行完后执行callback函数，meassage可传入callback函数中，从而监听动作背景音乐：cc.audioEngine.playMusic(res/my.mp3,true);播放背景音乐my.mp3，重复播放cc.audioEng

10、ine.stopMusic();停止背景音乐播放音效：var effect=cc.audioEngine.stopEffect(res/my.mp3,false);cc.audioEngine.stopEffect(effect);cc. audioEngine.stopALLEffects();开启音效my.mp3不重复播放，注：音效可同时播多个音量：cc.audioEngine.setEffectsVolume(0);设置背景音乐音量cc.audioEngine.setMusicVolume(0);设置音效音量恢复音量的方式：cc.audioEngine.setEffectsVolume(

11、1);恢复背景音乐音量cc.audioEngine.setMusicVolume(1);恢复音效音量一、即时动作1、放置12varplaceAction=cc.place(x,y);node.runAction(placeAction);上述代码将node节点放置到指定位置的(x, y)位置上。2、翻转1234varflipXAction=cc.flipX(true);varflipYAction=cc.flipY(true);node.runAction(cc.sequence(cc.delayTime(0.5),flipXAction,cc.delayTime(0.5),flipYActi

12、on);上述代码实现了节点的上下、左右翻转。动作序列中的延时函数是为了方便我们观看效果。3、显示和隐藏1234varshowAction=cc.show();varhideAction=cc.hide();node.runAction(cc.sequence(cc.delayTime(0.5),hideAction,cc.delayTime(0.5),showAction);上述代码实现了指定节点的隐藏和显示。4、删除自己12varremoveSelfAction=cc.removeSelf();node.runAction(removeSelfAction);上述代码将节点从场景中删除。5、

13、函数动作5.1 无参函数123456varcallAction=cc.callFunc(callback,this);node.runAction(callAction);/下面定义的是回调函数callback:function()cc.log(HelloCallback);上述代码运行时会在控制台打印一条Hello Callback语句。5.2 有参函数123456789101112131415varsayHello=function()cc.log(Helloworld,ImJeff);vardata=name:凌建风,age:22,doSth:sayHello;varcallAction

14、=cc.callFunc(callback,this,data);node.runAction(callAction);/下面是回调函数callback:function(sender,data)cc.log(Hellocallback+data);node.runAction(cc.callFunc(data.doSth);上述代码打印一条Hello callback+data的语句以及一条Hello world,Im Jeff的语句。回调函数中的sender就是callFunc函数中的this，表示其调用的对象。5.3 匿名函数1234varcallAction=cc.callFunc(f

15、unction()cc.log(Hellocallback););node.runAction(callAction);上述代码和无参函数效果类似，只是将函数体内置在了参数列表中，称为匿名函数。二、持续动作1、属性变化动作属性变化动作分为To和By两种。顾名思义，To表示直接将属性变化为指定的值，指定值为终点，而By表示属性的变动幅度为指定的值，指定值为变化量。1）move12varactionMoveTo=cc.moveTo(time,cc.p(x,y);varactionMoveBy=cc.moveBy(time,ccp(x,y);上述代码，第一行的意思是，在time秒内，将节点移动到(x

16、, y)位置上；第二行的意思是，在time秒内，将节点移动到坐标再加上(x, y)的位置上。我们省略了最终runAction的代码，在下面也是如此。2）jump12varactionJumpTo=cc.jumpTo(time,cc.p(x,y),height,count);varactionJumpBy=cc.jumpBy(time,cc.p(x,y),height,count);上述代码，第一行的意思是，在time秒内，节点要跳跃count次，每次跳跃的高度为height，停止跳跃之后的位置为(x, y)。第二行中，参数的意义是一样的，不同的是，停止跳跃时的坐标为原坐标加上(x, y)的值。

17、3）bezier123456varcontrolPointsTo=cc.p(x1,y1),/控制点1cc.p(x2,y2),/控制点2cc.p(x3,y3)/终点;varbezierTo=cc.bezierTo(time,controlPointsTo);bezierTo和bezierBy的作用是操作节点作贝塞尔曲线运动，所谓贝塞尔曲线，如下图所示：简单来说，就是控制节点从起始坐标经过曲线运动到达终点坐标，其中控制点1和2用于控制曲线轨迹的形成。而bezierBy与上述的移动、跳跃的By形式并无区别，在此省略，下面的讲解中也一样省略。4）scale12varactionScaleTo=cc.s

18、caleTo(time,scale);varactionScaleTo1=cc.scaleTo(time,scaleX,scaleY);上述代码表示将节点在time秒内缩放到原节点scale倍大小。scale大于1时图片放大，scale小于1时缩小。若有第三个参数，则第二个参数为X方向缩放倍数，第三个参数为Y轴方向缩放倍数。而对于scaleBy来说，scale表示的是基于当前节点大小的缩放倍数。另外，scaleBy是可逆的，而scaleTo是不可逆的。（使用reverse()逆转）。5）rotate12varactionRotateTo=cc.rotateTo(time,deltaAngle)

19、;varactionRotateTo=cc.rotateTo(time,deltaAngleX,deltaAngleY);上述代码实现的是节点的旋转。若无第三个参数，则节点在time秒内顺时针旋转deltaAngle度；若有第三个参数，则节点在x方向上旋转deltaAngleX度，在y方向上旋转deltaAngleY度。而rotateBy的旋转则以节点当前角度为准进行运动。2、视觉特效动作1）淡入淡出123varactionFadeIn=cc.fadeIn(time);varactionFadeOut=cc.fadeOut(time);varactionFadeTo=cc.fadeTo(tim

20、e,opacity);上述代码，第一行表示淡入，即在time秒内从当前透明度变为透明度255；第二行表示淡出，即在time秒内从当前透明度变为透明度0；第三行则表示在time秒内从当前透明度变为指定的透明度opacity。以上效果均可以使用reverse()逆转。2）颜色渐变12varactionTintTo=cc.tintTo(time,r,g,b);varactionTintBy=cc.tintBy(time,r,g,b);上述代码使用3个参数控制节点的RGB属性，从而达到使节点颜色渐变的效果。同样是在time秒内完成。3）闪烁1varactionBlink=cc.blink(time,c

21、ount);上述代码表示，节点在time秒内，要闪烁count次。4）摄像机1varorbit=cc.orbitCamera(time,radius,radiusD,zAngle,zAngleD,xAngle,xAngleD);上述代码创建一个球面坐标轨迹进行旋转操作。time表示旋转轨迹的时间；radius表示起始半径，radiusD表示半径差；zAngle表示起始z角，zAngleD表示旋转z角的差；xAngle表示起始x角，xAngleD表示旋转x角的差。5）跟随在另一个节点运行了一个action后，则可以使用follow使指定的对象跟随另一个节点运动。1object.runAction

22、(cc.follow(node,cc.rect(x,y,width,height);上述代码表示object对象（一般为层），跟随node节点运动。第二个rect参数如果不加上，则默认为(0, 0, 0, 0)，表示无边界的动作；若有非零的rect，则表示带边界的动作。若要详细理解该方法，建议在视频附带的源码中额外添加可滚动的背景，这样可以方便理解，不会造成误解。3、复合动作1）延时动作1varactionDelayTime=cc.delayTime(time);/time为延时的秒数延时动作多用于在动作序列sequence中，以方便观察其他动作。2）重复动作1234varactionRepe

23、at=action.repeat(count);varactionRepeat1=cc.repeat(action,count);varactionRepeatForever=action.repeatForever();varactionRepeatForever1=cc.repeatForever(action);上述代码包含了重复固定次数以及无限重复的两种写法。其中action是已经定义好的动作，count表示该动作需要重复的次数。3）序列动作1varsequence=cc.sequence(action1,action2,action3);序列动作在之前大家也已经见过很多了，其效果是让

24、多个指定的动作按照前后顺序逐一执行。其构造函数的参数个数没有限制。4）并发动作1varactionSpawn=cc.spawn(action1,action2);并发动作与序列动作相反，不是让动作按顺序执行，而是使它们在同一时刻同时进行。5）逆转动作1varactionRev=action.reverse();逆转动作即将指定action的动作倒过来执行一遍。需要注意的是有些动作是无法逆转的，而且针对web平台和native平台也有所区别，这就需要大家在实际操作中积累经验了。4、变速动作1）Speed1varspeedAction=cc.speed(action,times);speed方法的

25、作用是让指定的动作action以指定的times倍速度执行。2）ActionEase动作缓冲基本格式如下：1varactionEase=action.easing(ActionEase);其中action是要缓冲的动作，ActionEase是选择的缓冲模式。所能使用的缓冲模式中，比较基本的有：123456cc.easeBounceIn();/以弹性缓动效果开始cc.easeBounceOut();/以弹性缓动效果结束cc.easeBounceInOut();/以弹性缓动效果开始和结束cc.easeBackIn();/加速度向右，反方向缓慢移动cc.easeBackOut();/快速移动到结束，

26、然后缓慢返回到结束cc.easeBackInOut();/以EaseBackIn开始，以EaseBackOut结束一、节点的属性1、图形属性1.1 旋转1） 旋转的角度：Number rotation2） 向x轴方向倾斜的角度：Number rotationX3） 向y轴方向倾斜的角度：Number rotationY图形的旋转均以顺时针方向进行。默认旋转角度为01.2 缩放1） 缩放大小：Number scale2） x轴方向缩放大小：Number scaleX3） y轴方向缩放大小：Number scaleY默认的缩放大小为1，大于1则节点放大，小于1则节点缩小。1.3 倾斜1） x轴倾斜

27、角度：Number skewX2） y轴倾斜角度：Nubmer skewY倾斜与旋转的效果有些类似，但是实际上是不一样的。skewX表示X轴方向上的倾斜角度，该角度是Y轴与其左边缘之间的夹角；skewY表示Y轴方向上的倾斜角度，该角度是X轴与其底边缘之间的夹角。1.4 可见1） 是否可见：Bool visiblevisible为true，该节点可见；visible为false，该节点不可见。1.5 透明度1） 透明度：Number opacity2） 是否级联透明度：Bool cascadeOpacity透明度取值范围为：0-255，0时透明，255时不透明；级联透明度默认为false，表示是

28、否将该节点的透明度传递给与其相关（有父子关系）的节点上。1.6 颜色1） 颜色：cc.Color color2） 级联颜色：Bool cascadeColor3） 颜色值是否跟着透明度进行改变：Bool opacityModifyRGB此处级联与透明度的级联是一样的，而opacityModifyRGB表示透明度是否作用与颜色。2、其他属性2.1 父子关系1) 父亲：cc.Node parent2) 孩子：Array children3) 孩子数量：Number childrenCount2.2 计时器1） 计时器：cc.Scheduler scheduler计时器控制节点定时完成指定的动作。2

29、.3 运行状态1） 是否正在运行：Bool running2.4 动作管理1） 动作管理器：cc.ActionManager actionManager动作管理器是控制节点动画的管理器。2.5 渲染顺序1） 节点渲染顺序：Number arrivalOrder在zIndex的值相同的情况下，节点渲染顺序的值越大，该节点越晚被渲染。2.控制鼠标事件cc.eventManager.addListener(event:cc.EventListener.MOUSE, onMouseDown:function(event) , onMouseMove:function(event) , onMouseU

30、p:function(event) ,node);监听函数接收两对象，一个为监听信息对象，一个为监听的结点。mouse in cc.sys.capabilities;/做当前运行环境是否有鼠标事件的判断监听对象中的event对象：event.getLocation获取鼠标事件发生的全局坐标event.getLocationX/getLocationY /x坐标或y坐标event.getCurrentTarget获取当前处理鼠标事件的对象event.getButton 获取鼠标点击键值：左键还是右键event.getDelta:获取移动的偏移值event.getDeltaX/getDeltaY触

31、摸事件单点触摸cc.eventManager.addListener( event:cc.EventListener.TOUCH_ONE_BY_ONE, onTouchBegan:function(touch,event) , onTouchMoved:function(touch,event) , onTouchEnded:function(touch,event) , onTouchCancelled:function(touch,event) ,node);监听触摸开始，触摸移动，触摸结束，触摸取消（突然来电等）多点触摸：cc.eventManager.addListener( even

32、t:cc.EventListener.TOUCH_ALL_AT_ONCE, onTouchBegan:function(touches,event) , onTouchMoved:function(touches,event) , onTouchEnded:function(touches,event) , onTouchCancelled:function(touches,event) ,this);键盘事件每个键对应一个keyCode数字，如tab键对应为9cc.eventManager.addListener( event:cc.EventListener.KEYBOARD, onKey

33、Pressed:function(keyCode,event) , onKeyReleased:function(keyCode,event) ,node);重力感应器事件：cc.inputManager.setAccelerometerInterval(interval)( event:cc. inputManager. setAccelerometerEnabled(true), cc.eventManager.addListener( event:cc.EventListener.ACCELERATION, callback:function(accelerometerInfo,even

34、t) ,this);游戏进入后台/恢复显示事件cc.eventManager.addCustomListener(cc.game,EVENT_HIDE,function() );cc.eventManager.addCustomListener(cc.game,EVENT_SHOW,function() );3.定时器定时器scheduleUpdate（让游戏运行过程中每帧都执行update方法）：var ScheduleUpdateLayer = cc.Layer.extend( ctor:function()this._super();this.scheduleUpdate();,upda

35、te:function()/do something);JS原生定时器：setTimeOutSetItervalscheduleOnce定时器：node.scheduleOnce(callback,2);两秒后执行自己编写的函数callback，只能依赖节点触发schedule：node.schedule(callback,3,REPEAT_FOREVER,2);每间隔3秒触发一次callback函数，重复无数次，且第一次触发前的延迟时间为2秒 取消定时器：node.unscheduleUpdate(callback);取消定时器scheduleUpdate触发的callback函数node.

36、unschedule(callback); 取消定时器schedule触发的callback函数恢复暂停定时器：node.pause暂停定时器node.resume恢复定时器全屏显示function ChangeToFullScreen()/ /判断是否为全屏，如果全屏，则退出全屏，否则以全屏显示/ if(cc.screen.fullScreen()/ /退出全屏/ cc.screen.exitFullScreen();/ else /全屏显示 cc.screen.requestFullScreen();/ 游戏界面cc.LabelTTF的相关api1、 创建var text = new cc

37、.LabelTTF(“这是一段文字” , 文字的配置, 大小 );EG:var text = new cc.LabelTTF(“哈哈，文字哦”, Arial,24); / 创建了一段Arail，大小为24的字体2、 改变文字内容text.setString(“更改的内容啊”);3、 设置颜色label.setColor(cc.color(255, 0, 0, 255); / 将字体改为红色4、 设置文字大小label.setFontSize(100); /设置为100号字体5、 文字对齐label.textAlign = cc.TEXT_ALIGNMENT_CENTER;/居中cc.TEXT_

38、ALIGNMENT_LEFT; /居左cc.TEXT_ALIGNMENT_RIGHT; /居右PS:单行的文字，是无法看出textAlign的效果的说。用”n”换行试试6、 文字显示范围label.setDimensions(width, height); / 文字显示的范围7、 忽略anchor的设置label.ignoreAnchor = true; / 设置后，label的起始点在左下角8、 文字定义：var text = new cc.LabelTTF(“文字”, def);def 是这样定义:var def = new cc.FontDefinition(); / 声明文字定义def

39、.fontName = “宋体,微软雅黑”; / 字体def.fontSize = 24; / 字号大小def.textAlign = cc.TEXT_ALIGNMENT_CENTER; / 文字对齐def.fillStyle = cc.color(“#ffffff”); / 字体(内部)颜色def.strokeEnabled = true; / 开启文字描边效果def.strokeStyle = cc.color(“#ffeeee”); / 描边的颜色def.lineWidth = 3; / 字体的宽度defadowEnabled = true; / 开启阴影效果def.shadowOffs

40、etX = 12; / 阴影X轴效果def.shadowOffsetY = 12; / 阴影Y轴效果手工制作API（即用代码制作，不过一般采用cocos studio制作游戏界面）一、按钮1.MenuItemSpritenew cc.MenuItemSprite(spriteNormal,spriteSelected,spriteDisable,clickHandler,target);五个参数依次为正常态效果，按下时效果，禁用时效果，点击的回调函数，回调函数作用的对象。也可缺少禁用时的效果和回调函数的目标对象实例参考代码：var MenuItemSpriteLayer = cc.Layer.

41、extend( ctor: function () this._super(); var spriteNormal = new cc.Sprite(res/startgame.png); var spriteSelected = new cc.Sprite(res/startgame2.png); var spriteDisable = new cc.Sprite(res/startgame3.png);/ var menuSprite = new cc.MenuItemSprite(spriteNormal, spriteSelected, spriteDisable, this.start

42、Game.bind(this); var menuSprite = new cc.MenuItemSprite(spriteNormal, spriteSelected, spriteDisable, this.startGame); var menu = new cc.Menu(menuSprite); this.addChild(menu); menuSprite.setEnabled(false); , startGame: function () trace(this is MenuItemSpriteLayer?, this instanceof MenuItemSpriteLaye

43、r); );2.MenuItemImage：省去几个新建精灵的操作，使加载图片更便利用法：new cc.MenuItemImage(ImageNormalUrl, ImageSelectedUrl,ImageDisableUrl,clickHandler,target);实例参考代码：var MenuItemImageLayer = cc.Layer.extend( ctor: function () this._super(); var menuImage = new cc.MenuItemImage(res/startgame.png, res/startgame2.png, res/st

44、artgame3.png, this.startGame, this); var menu = new cc.Menu(menuImage); this.addChild(menu); , startGame: function () trace(menuImage clicked); );3.MenuItemFont：制作文字按钮new cc.MenuItemImage(text,clickHander,target);参数依次为文本内容，点击的回调函数，回调函数作用的对象。实例参考代码：var MenuItemFontLayer = cc.Layer.extend( ctor: funct

45、ion () this._super(); var menuFont = new cc.MenuItemFont(START GAME, this.startGame, this); menuFont.fontSize = 32; menuFont.fontName = Arial; var menu = new cc.Menu(menuFont); this.addChild(menu); , startGame: function () trace(start game button clicked); );4.MenuItemLabel:可使用更酷炫的字体new cc.MenuItemL

46、abel(ttf/bmfont,clickHander,target);实例参考代码：var MenuItemLabelLayer = cc.Layer.extend( ctor: function () this._super();/ var label = new cc.LabelTTF(START GAME, Arial, 32);/ var item = new cc.MenuItemLabel(label, this.startGame, this); var label = new cc.LabelBMFont(START GAME, res/font.fnt); var item

47、 = new cc.MenuItemLabel(label, this.startGame, this); var menu = new cc.Menu(item); this.addChild(menu); , startGame: function () trace(start game button clicked); );制作开关按钮：实例参考代码：var MenuItemToggleLayer = cc.Layer.extend( ctor: function () this._super(); cc.MenuItemFont.setFontName(Arial); cc.MenuI

48、temFont.setFontSize(32); var on = new cc.MenuItemFont(ON); var off = new cc.MenuItemFont(OFF); var item = new cc.MenuItemToggle(off, on, this.toggleMusic, this); var menu = new cc.Menu(item); this.addChild(menu); , toggleMusic: function () if(this.musicOff) trace(music on); this.musicOff = false; el

49、se trace(music off); this.musicOff = true; );菜单：var MenuLayer = cc.Layer.extend( ctor: function () this._super(); cc.MenuItemFont.setFontName(Arial); cc.MenuItemFont.setFontSize(24); var one = new cc.MenuItemFont(one, this.clickHandler); var two = new cc.MenuItemFont(two, this.clickHandler); var thr

50、ee = new cc.MenuItemFont(three, this.clickHandler); var four = new cc.MenuItemFont(four, this.clickHandler); var five = new cc.MenuItemFont(five, this.clickHandler); var six = new cc.MenuItemFont(six, this.clickHandler); var menu = new cc.Menu(one, two, three, four, five, six); this.addChild(menu);/ menu.alignItemsVertically();/ menu.alignItemsHorizontally(); menu.alignItemsHorizontal