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