Cocos2d-JS开发中的一些小技巧（持续更新）

1、获取URL中的请求参数的值----此方法接收参数名

1 2 3 4 5 6

function getQueryString(name) {      var reg =  new  RegExp( "(^|&)"  + name +  "=([^&]*)(&|$)" ,  "i" );      var r = window.location.search.substr(1).match(reg);      if  (r != null)  return  decodeURIComponent(r[2]);      return  null; };

2、底图上添加文字---适用于按钮Sprite

1 2 3 4 5 6 7 8 9 10

var MyButtonSprite = cc.Sprite.extend({      ctor: function (fileName, title, fontName, fontSize) {          this ._super(fileName);             var titleLabel =  new  cc.LabelTTF(title, fontName, fontSize);          this .addChild(titleLabel);          titleLabel.x =  this .getContentSize().width / 2;          titleLabel.y =  this .getContentSize().height / 2;      } });

3、远程图片加载

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

loadImgFromUrl: function (target, imgUrl, p, tag) {          if (!imgUrl) return ;          var self = target;          var loadCb = function(err, img){              cc.textureCache.addImage(imgUrl);              var texture2d =  new  cc.Texture2D();              texture2d.initWithElement(img);              texture2d.handleLoadedTexture();              var sp =  new  cc.Sprite();              sp.initWithTexture(texture2d);              self.addChild(sp);              sp.x = p.x;              sp.y = p.y;              sp.tag = tag;          };          cc.loader.loadImg(imgUrl, {isCrossOrigin :  false  }, loadCb);      },

4、XMLHttpRequest

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29

var sendRequest = function(url, params, isPost, callback, errorcallback){      if (url == null || url ==  '' )          return ;                 var xhr = cc.loader.getXMLHttpRequest();      if (isPost){          xhr.open( "POST" ,url);      } else {          xhr.open( "GET" ,url);      }      xhr.setRequestHeader( "Content-Type" ,  "application/x-www-form-urlencoded" );      xhr.onreadystatechange = function () {          if (xhr.readyState == 4 && xhr.status == 200){              var response = xhr.responseText;              if (callback)                  callback(response);          } else  if (xhr.readyState == 4 && xhr.status != 200){              var response = xhr.responseText;              if (errorcallback)                  errorcallback(response);          }      };         if (params == null || params ==  "" ){          xhr.send();      } else {          xhr.send(params);      } };

5、JSON解析以及上述第4条的回调方法

1 2 3 4 5 6 7 8

var callback = function (response) {          var jsonData = JSON.parse(response);          var data = jsonData[ "users" ];          if (data){              alert(data[ "name" ]);              // todo something          }      };

6、自定义Loading界面

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91

var MyLoaderScene = cc.Scene.extend({      _interval : null,      _length : 0,      _count : 0,      _label : null,      _className: "MyLoaderScene" ,      init : function(){          var self =  this ;             // bg          var bgLayer = self._bgLayer = cc.LayerColor.create(cc.color(32, 32, 32, 255));          bgLayer.setPosition(cc.visibleRect.bottomLeft);          self.addChild(bgLayer, 0);             //loading percent          var label = self._label = cc.LabelTTF.create( "玩命加载中... 0%" ,  "Arial" , 24);          label.setPosition(cc.pAdd(cc.visibleRect.center, cc.p(0, 0)));          label.setColor(cc.color(180, 180, 180));          bgLayer.addChild( this ._label, 10);          return  true ;      },         _initStage: function (img, centerPos) {          var self =  this ;          var texture2d = self._texture2d =  new  cc.Texture2D();          texture2d.initWithElement(img);          texture2d.handleLoadedTexture();          var logo = self._logo = cc.Sprite.create(texture2d);          logo.setScale(cc.contentScaleFactor());          logo.x = centerPos.x;          logo.y = centerPos.y;          self._bgLayer.addChild(logo, 10);      },         onEnter: function () {          var self =  this ;          cc.Node.prototype.onEnter.call(self);          self.schedule(self._startLoading, 0.3);      },         onExit: function () {          cc.Node.prototype.onExit.call( this );          var tmpStr =  "玩命加载中... 0%" ;          this ._label.setString(tmpStr);      },         /**       * init with resources       * @param {Array} resources       * @param {Function|String} cb       */      initWithResources: function (resources, cb) {          if (typeof resources ==  "string" ) resources = [resources];          this .resources = resources || [];          this .cb = cb;      },         _startLoading: function () {          var self =  this ;          self.unschedule(self._startLoading);          var res = self.resources;          self._length = res.length;          self._count = 0;          cc.loader.load(res, function(result, count){ self._count = count; }, function(){              if (self.cb)                  self.cb();          });          self.schedule(self._updatePercent);      },         _updatePercent: function () {          var self =  this ;          var count = self._count;          var length = self._length;          var percent = (count / length * 100) | 0;          percent = Math.min(percent, 100);          self._label.setString( "玩命加载中... "  + percent +  "%" );          if (count >= length) self.unschedule(self._updatePercent);      } }); MyLoaderScene.preload = function(resources, cb){      var _myLoaderScene = null;      if (!_myLoaderScene) {          _myLoaderScene =  new  MyLoaderScene();          _myLoaderScene.init();      }      _myLoaderScene.initWithResources(resources, cb);         cc.director.runScene(_myLoaderScene);      return  _myLoaderScene; };

7、网页跳转

1	window.location.href =  "http://www.baidu.com"

8、关于进入游戏时黑屏时间较长的处理方法

1）

1	<body style= "padding:0; margin: 0; background: #000;" >

删除index.html中<body>标签的样式background: #000;

2）按照自己需要添加编译模块 修改project.json如

1	"modules"  : [ "core" ,  "actions" , "shape-nodes" ,  "labels" , "menus" , "transitions" , "physics" , "chipmunk" , "gui" ],

本文由CocoaChina会员happyfhc总结，欢迎大家学习与讨论。

来源网址：http://www.cocoachina.com/bbs/read.php?tid=226079