Cocos2d-x——导入Cocostudio资源

（搬运自我在SegmentFault的博客）

目前正在和实训的小组成员一起做一款手机2D游戏，我们采用了Cocos2d-x进行开发。之前虽然早有耳闻，这次却是第一次认真地学习和使用Cocos2d-x。最开始的几天就是在不停的看文档和爬坑。其中一个坑就是Cocostudio这货。官网的文档滞后而且不够详细，为了弄清楚，借鉴了很多博客，也阅读了示例代码。

本人Cocos2d-x的版本是3.1，Cocostudio的版本是1.5.
Cocostudio目前的功能包括UI编辑器、动画编辑器、场景编辑器和数据编辑器。数据编辑器没有涉及到，就不说了。剩下三者中主要讲下导入UI编辑器的资源。
UI编辑器导出的文件包括一个.ExportJson文件，一个.plist文件和一个.png文件。Cocostudio中文官网中说的是TouchGroup，英文官网中是UILayer，可是都已经不存在了。UILayer变成了Layer，现在也可以不创建Layer，直接加到场景上面。所以代码可以这样：

Node *pNode = GUIReader::getInstance()->widgetFromJsonFile("test.ExportJson");
this->addChild(pNode);

下面就可以用getChildByTag来获取组件了。不过getChildByTag貌似只能按照树的结构一层层照下来，显得很麻烦，而且不能按照名字来取。所以，现在可以用ui中的Helper直接从树中获取组件，用name或者tag。但seekWidgetByTag和seekWidgetByName的第一个参数是Widget类型，需要将pNode转成Widget类型。（从.ExportJson文件可以看出来，pNode本来就是一个Widget类型的树）

Button *button = (Button*)(ui::Helper::seekWidgetByName(pNode, "button"));

顺便附上绑定事件监听的代码，使看到的人免去寻找之苦。

button->addTouchEventListener(CC_CALLBACK_2(MainScene::touchEvent, this));

touchEvent是自己写的方法。这个方法大致是如下用法，注意pSender和type的使用。

    void SingleMenuScene::selectEvent(Ref *pSender, Widget::TouchEventType type)
{
	switch(type)
	{
	case Widget::TouchEventType::ENDED:
		GameSetting::Map map = GameSetting::Map::DEFAULT;
		if(pSender == defaultBtn)
		{
			map = GameSetting::Map::DEFAULT;
		}
		else if(pSender == snowBtn)
		{
			map = GameSetting::Map::SNOW;
		}

		Scene *game = BattleScene::createScene(map);
		TransitionScene *transition = TransitionFade::create(0.5, game);
		Director::getInstance()->replaceScene(transition);

	}
}

导入动画编辑器的动画的代码如下：

CCArmatureDataManager::sharedArmatureDataManager()->addArmatureFileInfo("Animation0.png","Animation0.plist","Animation.ExportJson");
CCArmature *armature = CCArmature::create("Animation");
armature->getAnimation()->playByIndex(0);
armature->setScale(0.5f);
armature->setPosition(ccp(visibleSize.width * 0.5, visibleSize.height * 0.5));
this->addChild(armature);

导入场景编辑器的场景的代码如下：

Node* pNode = SceneReader::getInstance()->createNodeWithSceneFile("scene.ExportJson");
this->addChild(pNode);

这个读出的Node貌似不能转成Widget，因为它不仅包括UI组件还有动画等资源。获取组件和绑定事件监听可以这样写：

ComRender *render = (ComRender*)(pNode->getChildByTag(10010)->getComponent("GUIComponent"));
Widget *widget = (Widget*)(render->getNode());
widget->addTouchEventListener(CC_CALLBACK_2(MainScene::touchEvent, this));