cocos2d-x 3.0 使用UILayout布局开发

Cocos2dx使用cocostudio导出的UI文件进行UI设置。

 

1. 添加库项目

 

在“解决方案资源管理器”中找到整个解决方案，右击，选择“添加”->“现有项目”。在弹出的对话框中找到“项目目录/cocos2d/cocos/editor-support/cocostudio/proj.win32/libCocoStuido”点击确定，即可加入到解决方案中，效果如图所示：

 

 

2. 添加库项目

找到目标项目“cocosTest”右击，选择“添加”，然后“引用..”。在弹出的属性页中点选下面的“添加新引用”。在弹出的子级对话框中选择我们需要的库，点击确定，即可添加项目对库的引用。

 

这样libCocoStudio就添加好了，同样的方法，添加libGUI和libExtension两个库。

 

代码上，首先要加入包含目录“$(EngineRoot)cocos\editor-support”和“$(EngineRoot)cocos”，然后include文件就可以了。

 

Layout*　layout =static_cast<Layout*>(GUIReader::getInstance()->widgetFromJsonFile("ui/GameUI.ExportJson"));

 gameLayer->addChild(layout,GAME_SCORE_ZORDER, GAME_UI_LAYOUT_TAG);

 TextBMFont* depth =static_cast<TextBMFont*>(layout->getChildByTag(GAME_UI_DEPTH));

 Button* distance = static_cast<Button*>(layout->getChildByTag(GAME_UI_DISTANCE));

 ImageView* readyView =static_cast<ImageView*>(layout->getChildByName("ready"));

 depth->setText("new string");

 

这里主要讲一下TextBMFont，不知道为什么UI文件使用了LabelBMFont，在代码中直接转换为LabelBMFont时，动态修改数值时会报错。可能是因为LableBMFont不是Wedget的子类。因此Label需要转换为TextBMFont，然后在使用depth->setText("new string");就可以了。其他的都是正常的使用。