CocosStudioで作ったSpriteやボタンを再帰的に取得する

ビルトイン関数では子Nodeしか探せない

cocos2d-jsでゲームを作るとき、UIはCocosStduioで作るとカンタンだ。
しかしCocosStduioで配置したSpriteやボタンを操作したいなら、外からそれらを取得しなければならない。
例えば配置したボタンに対し、Advanced→method→clickで関数名を書いた所で、そのボタンに関数を実装するのは外からやらねばならない。
この時、ボタンを取得するにはgetChildByTagやgetChildByNameを使うのだが、名前から分かる通りこれらは子供しか探せない。
これだと、CocosStudioで複数のnodeやlayerを組み合わせてsceneを作ってccs.loadでsceneを読み込んだとき、目的のボタンを探しだすのが面倒くさい。
cocos2dの構造はsceneを頂点とした木構造でDOMみたいなものなのだから、querySelectorとまでは言わずともせめてgetElementById的な物くらいはあってもいいのだが、どうやら見当たらないので実装しておくと便利だ。

子Nodeだけでなく子孫Nodeまで探索するfindNodeByName

findNodeByName.js

cc.Node.prototype.findNodeByName = function (name) {
    var result = this.getChildByName(name);
    if (!result) {
        var i, imax = this.childrenCount;
        for (i = 0; i < imax; i++) {
            var child = this.children[i];
            result = child.findNodeByName(name);
            if (result) {
                break;
            }
        }
    }
    return result;
}

findNodeByName.ts

(<cc.Node> cc.Node.prototype).findNodeByName = function(name):cc.Node{
    var result = this.getChildByName(name);
    if(!result){
        var i,imax=this.childrenCount;
        for(i=0;i<imax;i++){
            var child = this.children[i];
            result = child.findNodeByName(name);
            if(result){
                break;
            }
        }
    }
    return result;
}

CocosStudio上でSpriteやボタンを作成するとデフォルトで名前がつくが、これが一意でないと目当てのものとは違ったものが返ってくることがあるので注意。

使用例

var layerObj = ccs.load(res.json_layer);
var layer = layerObj.node;
var button_1 = layer.findNodeByName('Button1');
button_1.addClickEventListener(function(){
    // クリックした時の処理
});