Cocos2d-x 3.0 开发(四)使用CocoStudio创建UI并载入到程序中

转载 2015年07月10日 08:58:09

1、概述

    CocoStudio的使用无疑是cocos2d-x 3.0的重要组成部分,接下来我们用它来创建一组UI,并将其读入到程序中显示出来。先上效果图:




2、创建、编辑UI

    首先,运行CocoStudio,选择UI Editer(第二个)。进入后,从“文件”->“新建项目”->输入相应的项目名称和路径。创建好的新项目应该是这样:




    接下来就是大家随意发挥啦。在旁边的ToolBar控件随便拽一些上去,看看都是些什么功能,具体我就不细说了。可以在画布列表中重命名画布,这将影响导出的文件名称,我的项目将其改为testUI。资源的话,放到CocosStudio目录中的Resource文件夹中即可。

    另外注意一点,如果这个按钮是有交互效果的,在 属性 –> 常规 -> 交互 的选项要勾选,否则没有点击效果。如图:

 


3、导出

    在导出之前,最好先创建一个新的工程。运行我们的脚本文件,给新工程起名为:HelloStudio。编译运行,保证它没问题。

    回到CocoStudio中,点选 文件 –> 导出项目 。在导出资源的位置,选择“导出使用大图”。同时将目录改为我们项目文件的Resource目录。



4、加载到程序中

 切换到VS2012中更改HelloWorld类中的init()方法:


  1. bool HelloWorld::init()  
  2. {  
  3.     //////////////////////////////  
  4.     // 1. super init first  
  5.     if ( !Layer::init() )  
  6.     {  
  7.         return false;  
  8.     }  
  9.   
  10.     /////////////////////////////////  
  11.     UILayer* uiLayer = UILayer::create();  
  12.     auto myLayout = dynamic_cast<Layout*>(CCUIHELPER->createWidgetFromJsonFile("testUI.ExportJson")); //alpha0中使用  
  13.         auto myLayout = cocostudio::GUIReader::shareReader()->widgetFromJsonFile("testUI.ExportJson")); //alpha1中使用  
  14.     uiLayer->addWidget(myLayout);  
  15.     this->addChild(uiLayer);  
  16.       
  17.     return true;  
  18. }  

编译运行,就可以了。


5、总结

    通过CocoStudio进行可视化编辑,然后将编辑好的文件导出成Json格式的配置文件,在程序中加载这个文件来创建一个UIWidget,实现图形化界面到程序的完整关联。相应Demo 可以在下面下载:


Demo下载: http://download.csdn.net/detail/fansongy/6404989 

相关文章推荐

Cocos2d-x 3.0 开发(四)使用CocoStudio创建UI并载入到程序中

CocoStudio的使用无疑是cocos2d-x 3.0的重要组成部分,接下来我们用它来创建一组UI,并将其读入到程序中显示出来。先上效果图:

Cocos2d-x 3.0开发(五)关联程序逻辑与cocoStudio导出文件

上篇说到将CocoStudio的导出文件在程序中运行出来,但是并没有用户交互,即点击响应,程序的逻辑判断也都没有。这篇中我们把它们加进去,这样就可以算一个完整的程序了。先上个图:......

Cocos2d-x 3.0 开发(七)在程序中处理cocoStudio导出动画

使用cocoStudio可以方便的制作动画,接下来的工作就是在我们的程序中使用制作好的动画。这篇中,我将使用程序将两个动画连接起来。有图有真相:

Cocos2d-x3.0 加载Cocostudio的UI后,按钮无法点击的解决方法

最近发现不少朋友都遇到这个问题,用Cocostudio的UI编辑器创建好UI后,在代码中加载UI,然后给按钮(Button)添加点击监听事件,发现无论如何都点击不了按钮,没有任何反应。 或者,往按钮...

Cocos2d-x3.0 加载Cocostudio的UI后,按钮无法点击的解决方法

原帖地址:http://blog.csdn.net/musicvs/article/details/28390617
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)