Cocos2d 您所在的位置:网站首页 serialparseint函数 Cocos2d

Cocos2d

2023-02-28 18:38| 来源: 网络整理| 查看: 265

另:本章所用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 实验室设备网 版权所有