cocos2d-x 界面编程一(cocostudio GUI的初级使用)

原创 2013年12月26日 22:18:49

本来想写点网络的东西,但是好像网络的东西还是服务端要求学习的内容比较多,所以最近也开始学习使用thinkPHP框架,因此网络这块暂时也就写到这两篇吧。现在开始也要学习cocostudio了,这东西经过一段时间的发展,终于已经可以真正放心运用到项目中了,里面的UI相当强大,所以不学的话,界面设计这块的效率会低很多。

在最近的cocos2d-x版本中已经嵌入了cocostudio GUI,在工程里可以直接引用cocostudio相关的控件,想了解的话可以直接进新版本cocos2d-x的testCPP项目里运行extension中的各个cocostudioGUI项目,可以一个个浏览里面的控件……

虽然已经集成了这些cocostudio GUI,但是如果要控制这些控件元素的位置还是使用cocostudio编辑器靠谱,不过这里要说的使用方法并不是官方帮助文档中所介绍的加载方式,在我用的cocos2d-x2.21版本中,可以通过sceneReader来读取cocostudio编辑器导出的场景工程文件,通过GUIReader来读取编辑器导出的UI工程文件,当然还有很多其它相关元素的加载控制方法,所以并不需要再像以前一样去加载一次cocostudio的库。

首先是要进入cocostudio编辑器,进入UI编辑器,起始页里面会有几个示例工程,点击新建一个这样的工程,比如:登录界面,然后可以看到一个现成的登录界面已经设计好了,直接打开文件菜单,导出这个项目,把导出的项目文件全部copy到一个新建的cocos2d-x工程的资源文件夹里,这时不可以开始使用这个UI了,看下面的代码:

#include "HelloWorldScene.h"
#include "cocos-ext.h"
//cocostudioGUI被封装在了熟悉的cocosExt中,所以包含下这个文件 ,加个命名空间
USING_NS_CC;
//这里是在项目场景加载时就加入对应UI了
CCScene* HelloWorld::scene()
{
    // 'scene' is an autorelease object
    CCScene *scene = CCScene::create();
    
    // 'layer' is an autorelease object
    HelloWorld *layer = HelloWorld::create();
	//这里用了一个cocostudio的层
	UILayer *m_pUiLayer =UILayer::create();
       //在这里把UI元素加载进层中,可以看到这里使用了GUIReader,源代码里可以看到GUIReader返回的是一个UIWidget,这个UIWidget是从我们导出的UI项目所生成的Json文件加载进来的
	m_pUiLayer->addWidget(GUIReader::shareReader()->widgetFromJsonFile("DemoLogin.json"));
	
    // add layer as a child to scene
    scene->addChild(layer);
    //将界面加入场景
	scene->addChild(m_pUiLayer);
    // return the scene
    return scene;
}
这样运行工程后就可以看到一个登录界面,可以随意输入用户名和密码,勾选checkBox,按按钮等……这让我想起了cocos2d-x自带的editBox在win下让人有多不悦(这让我觉得有cocostudio这种东西真好……)

这个示例比较简单,就不传源代码了……

相关文章推荐

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

本篇博客出自阿修罗道,转载请注明出处:http://blog.csdn.net/fansongy/article/details/12757411 1、概述     CocoStudio的使...

Cocos2d-x v3.1 GUI系统--环境构建(七)

Cocos2d-x v3.1 GUI系统--环境构建(七)         在使用Cocos2d-x的GUI系统时,由于生成的工程默认是没有将GUI系统所需的库导入到项目的,所以我们必须把库导入到工...

cocostudio: GUIReader分析(1)

GUIReader分析(1): 1、GUIReader用于cocostudio所做UI界面导出json的解析, 并生成对应的UI元素。 GUIReader* GUIReader::shareReade...

【cocos2dx-3.2】调用cocostudio::GUIReader 提示不是命名空间

【cocos2dx-3.2】调用cocostudio::GUIReader 提示不是命名空间

cocos2dx开发者指南:UI控件使用

综述 Cocos2d-x提供了一套易于使用的UI API来满足你的GUI需求,其中包括:Label、Menu、MenuItems、Buttons和Views。 Label(标签) C...

零基础学cocos2dx 3.0(顺带学C++)第一篇 切换场景

不会去重复一些概念性的东西,具体的内容,我在代码中已经备注出来。先看目录,这个创建完项目目录的Classes文件夹下有4个文件,我把helloworld那两个文件直接改了名字,这里我叫MainScen...

cocos2dx Button不是cocos2d::ui 的成员

Button不是cocos2d::ui 的成员

cocos2dx——cocostudio界面的使用详解

1.我用最新的2.3的cocostudio摆了个简单的界面:  继承关系(名字比较乱没改): 2.在cocos2dx lua程序中使用 【加载界面】   用cocostudio...

cocos2dx-ui的分类与使用

cocos2dx-ui的分类与使用

Cocos2dx之使用UI库结合cocostudio

使用cocostudio的UI编辑器编辑好UI界面,导出UI文件,直接在cocos2dx中使用,通过tag或者name来获取到UI控件 1、编辑ui界面,直接用模板然后拖几个控件过去 ...
  • Arxi
  • Arxi
  • 2014年06月13日 12:40
  • 9129
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:cocos2d-x 界面编程一(cocostudio GUI的初级使用)
举报原因:
原因补充:

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