Cocos2d | 您所在的位置:网站首页 › serialparseint函数 › Cocos2d |
另:本章所用Cocos2d-x版本为: Cocos2d-html5-v2.1.1 http://cn.cocos2d-x.org/download
html5的时代正在来临,其可以方便的运行在多平台上并调用OPENGL 进行图形渲染,大量使用html5开发的2D和3D游戏正在涌现,Cocos2d-x也顺应形势推出了相应的版本,今天我们来学习一下Cocos2d-x在Html5上怎么运行和开发及调试。
打开HelloHTML5World,可以看到以下文件和目录: res:资源图片目录: src:当前程序的js文件目录: main.js:主逻辑js代码文件 index.html:html5网页文件 cocos2d.js:加载Cocos2d-x库的文件 build.xml:编译cocos2d-x的html5平台版本生成的文件清单报告。 .DS_Store:系统目录显示属性存储文件,可以删除。 我们用浏览器直接打开index.html,可以看到: 其源码为: [html] view plaincopy Cocos2d-html5 Hello World test可以看到,这里面关键的要点是两个地方: 1. 在html5中创建了一个画布(canvas),设定了名称和大小 2. 在网页中加载了cocos2d.js 打开cocos2d.js后,可以看到下面的代码: [javascript] view plaincopy(function () { //定义变量d为当前网页的文档对象 var d = document; //定义变量c为一个结构,存储了一些配置属性和值。 var c = { COCOS2D_DEBUG:2, //0 to turn debug off, 1 for basic debug, and 2 for full debug box2d:false,//不使用box2d chipmunk:false,//不使用chipmunk showFPS:true,//显示FPS frameRate:60,//设定每秒60帧 loadExtension:false,不载入扩展库 tag:'gameCanvas', //运行cocos2d-x的画布 engineDir:'../cocos2d/',//引擎的目录,这里指定为当前上级目录下的cocos2d目录中 //SingleEngineFile:'',//这里注释掉了。 appFiles:[//应用程序要使用到的两个js文件。 'src/resource.js',//资源定义文件 'src/myApp.js'//逻辑处理文件 ] }; //当前窗口加载一个事件响应处理,在DOM被加载时调用。 window.addEventListener('DOMContentLoaded', function () { //当前文档创建一个脚本 var s = d.createElement('script'); //如果c结构中有SingleEngineFile变量并肯engineDir为空,则s中的脚本引用为SingleEngineFile指示的文件,当然,本例中这个变量注释掉了,这一段不成立。 if (c.SingleEngineFile && !c.engineDir) { s.src = c.SingleEngineFile; } //如果engineDir有效,则s中的脚本引用为engineDir指定目录下的相应文件,本例中为“../cocos2d/platform/jsloader.js”。 else if (c.engineDir && !c.SingleEngineFile) { s.src = c.engineDir + 'platform/jsloader.js'; } else { //如果都不是,弹出对话框提示c结构成员变量设置错误。 alert('You must specify either the single engine file OR the engine directory in "cocos2d.js"'); } //将结构c做为一个成员变量存入到当前文档。 document.ccConfig = c; //上面创建的‘script’的id设置为’cocos2d-html5’. s.id = 'cocos2d-html5'; //将这个script加入到当前HTML文档的结尾。 d.body.appendChild(s); //else if single file specified, load singlefile }); })(); 本页代码的作用是在html页面尾部中加入:“ 下面我们来打开cocos2d目录下的’platform/jsloader.js’: [javascript] view plaincopy//脚本执行函数。 (function () { //定义变量engine为一个字符串数组,元素为运行当前版本cocos2d-x要加载的所有代码文件。 var engine = [ 'platform/CCClass.js', 'platform/miniFramework.js', 'platform/CCCommon.js', 'platform/ZipUtils.js', 'platform/base64.js', 'platform/gzip.js', 'platform/CCMacro.js', 'platform/CCFileUtils.js', 'platform/CCTypes.js', 'platform/zlib.min.js', 'cocoa/CCGeometry.js', 'platform/Sys.js', 'platform/CCConfig.js', 'cocoa/CCSet.js', 'cocoa/CCNS.js', 'cocoa/CCAffineTransform.js', 'support/CCPointExtension.js', 'support/CCUserDefault.js', 'base_nodes/CCNode.js', 'base_nodes/CCAtlasNode.js', 'textures/CCTexture2D.js', 'textures/CCTextureCache.js', 'textures/CCTextureAtlas.js', 'misc_nodes/CCRenderTexture.js', 'misc_nodes/CCProgressTimer.js', 'effects/CCGrid.js', 'effects/CCGrabber.js', 'actions/CCAction.js', 'actions/CCActionInterval.js', 'actions/CCActionInstant.js', 'actions/CCActionManager.js', 'actions/CCActionProgressTimer.js', 'actions/CCActionCamera.js', 'actions/CCActionEase.js', 'actions/CCActionGrid.js', 'actions/CCActionTiledGrid.js', 'actions/CCActionCatmullRom.js', 'layers_scenes_transitions_nodes/CCScene.js', 'layers_scenes_transitions_nodes/CCLayer.js', 'layers_scenes_transitions_nodes/CCTransition.js', 'layers_scenes_transitions_nodes/CCTransitionProgress.js', 'layers_scenes_transitions_nodes/CCTransitionPageTurn.js', 'sprite_nodes/CCSprite.js', 'sprite_nodes/CCAnimation.js', 'sprite_nodes/CCAnimationCache.js', 'sprite_nodes/CCSpriteFrame.js', 'sprite_nodes/CCSpriteFrameCache.js', 'sprite_nodes/CCSpriteBatchNode.js', 'label_nodes/CCLabelAtlas.js', 'label_nodes/CCLabelTTF.js', 'label_nodes/CCLabelBMFont.js', 'particle_nodes/CCParticleSystem.js', 'particle_nodes/CCParticleSystemQuad.js', 'particle_nodes/CCParticleExamples.js', 'particle_nodes/CCParticleBatchNode.js', 'touch_dispatcher/CCTouchDelegateProtocol.js', 'touch_dispatcher/CCTouchHandler.js', 'touch_dispatcher/CCTouchDispatcher.js', 'touch_dispatcher/CCMouseDispatcher.js', 'keyboard_dispatcher/CCKeyboardDelegate.js', 'keyboard_dispatcher/CCKeyboardDispatcher.js', 'text_input_node/CCIMEDispatcher.js', 'text_input_node/CCTextFieldTTF.js', 'CCDirector.js', 'CCCamera.js', 'CCScheduler.js', 'CCLoader.js', 'CCDrawingPrimitives.js', 'platform/CCApplication.js', 'platform/CCSAXParser.js', 'platform/AppControl.js', 'menu_nodes/CCMenuItem.js', 'menu_nodes/CCMenu.js', 'tileMap_parallax_nodes/CCTMXTiledMap.js', 'tileMap_parallax_nodes/CCTMXXMLParser.js', 'tileMap_parallax_nodes/CCTMXObjectGroup.js', 'tileMap_parallax_nodes/CCTMXLayer.js', 'tileMap_parallax_nodes/CCParallaxNode.js', 'menu_nodes/CCMenuItem.js', 'menu_nodes/CCMenu.js', 'base_nodes/CCdomNode.js', '../CocosDenshion/SimpleAudioEngine.js' ]; //取得当前文档存入d,取得上一节中创建的当前d的成员变量ccCofing存入c. var d = document; var c = d.ccConfig; //如果c的结构变量loadExtension有效,即当前程序需要加载扩展库,则在上面的变量engine所对应的字符串数组尾部添加cocos2d-x扩展库所涉及的代码文件。 if (c.loadExtension != null && c.loadExtension == true) { engine = engine.concat([ '../extensions/GUI/CCControlExtension/CCControl.js', '../extensions/GUI/CCControlExtension/CCControlButton.js', '../extensions/GUI/CCControlExtension/CCControlUtils.js', '../extensions/GUI/CCControlExtension/CCInvocation.js', '../extensions/GUI/CCControlExtension/CCScale9Sprite.js', '../extensions/GUI/CCControlExtension/CCMenuPassive.js', '../extensions/GUI/CCControlExtension/CCControlSaturationBrightnessPicker.js', '../extensions/GUI/CCControlExtension/CCControlHuePicker.js', '../extensions/GUI/CCControlExtension/CCControlColourPicker.js', '../extensions/GUI/CCControlExtension/CCControlSlider.js', '../extensions/GUI/CCControlExtension/CCControlSwitch.js', '../extensions/GUI/CCScrollView/CCScrollView.js', '../extensions/GUI/CCScrollView/CCSorting.js', '../extensions/GUI/CCScrollView/CCTableView.js', '../extensions/CCBReader/CCNodeLoader.js', '../extensions/CCBReader/CCBReaderUtil.js', '../extensions/CCBReader/CCControlLoader.js', '../extensions/CCBReader/CCSpriteLoader.js', '../extensions/CCBReader/CCNodeLoaderLibrary.js', '../extensions/CCBReader/CCBReader.js', '../extensions/CCBReader/CCBValue.js', '../extensions/CCBReader/CCBKeyframe.js', '../extensions/CCBReader/CCBSequence.js', '../extensions/CCBReader/CCBRelativePositioning.js', '../extensions/CCBReader/CCBAnimationManager.js', '../extensions/CCControlEditBox.js' ]); } //如果c中的engineDir设置无效,清空engine。 if (!c.engineDir) { engine = []; } else { //如果c中的engineDir设置有效 //如果c的结构中有结构变量box2d和chipmunk,则在变量engine所对应的字符串数组尾部添加cocos2d-x物理引擎库所涉及的代码文件。 if(c.box2d || c.chipmunk){ engine.push('Draw_Nodes/CCDrawNode.js'); engine.push('physics_nodes/CCPhysicsSprite.js'); engine.push('physics_nodes/CCPhysicsDebugNode.js'); if (c.box2d) engine.push('../box2d/box2d.js'); if (c.chipmunk) engine.push('../chipmunk/chipmunk.js'); } //遍历engine中的所有元素,将各元素的文件相对目录转变为绝对目录。 engine.forEach(function (e, i) { engine[i] = c.engineDir + e; }); } //定义量时变量 var loaded = 0; //在engine最尾部加上c的结构变量appFiles (即当前程序资源和逻辑所对应的js),将新数组保存到que。 var que = engine.concat(c.appFiles); //再加上当前程序的主逻辑js文件。 que.push('main.js'); //判断浏览器是否是IE9 if (navigator.userAgent.indexOf("Trident/5") > -1) { //如果是IE9 //创建一个局部变量serial,存值-1 this.serial = -1; //定义一个函数loadNext var loadNext = function () { //定义临时变量s为serial+1 var s = this.serial + 1; //如果s所指定的索引小于que的数组数量. if (s |
CopyRight 2018-2019 实验室设备网 版权所有 |