Cocos2d-x V3.2+Cocos Studio1.6 实现一个简单的uibutton点击功能

好久没写博客了

这几天在学习cocos studio，这个软件可以很方便的设计游戏的一些界面，并导入到cocos2dx中，今天就用button来做个样例

首先我们打开Cocos Studio1.6，选择UIEditor，进去后我们发现有非常多的演示样例，我们就悬着一个叫demologin的演示样例

选择好后我们发现例如以下图，简介了下功能

这里我们选中那个loginbutton，发现这个button的实例名叫login_Button，这个名字我们等会代码里要用，然后我们保存一下

在保存路径下找到这个project目录，打开

有这些文件，我们把Json和Resources目录下的资源拷贝到cocos2dx中的资源目录中

这个json文件就是记录了这个widget的各种数据，cocos2dx会解析这些数据然后还原这个界面，感兴趣的能够打开研究下

好了到了代码阶段，我就简单的创建了个helloworld，可是我们要把三个外部的project库导入这个解决方式并引用并在头文件里包括

好了，以下就是代码了

//HelloWorldScene.h
#ifndef __HELLOWORLD_SCENE_H__
#define __HELLOWORLD_SCENE_H__

#include "cocos2d.h"
//导入这三个头文件
//注意在这个project的属性->C\C++ ->常规->附加包括文件夹 中加入这三个文件的路径
#include "cocostudio/CocoStudio.h"
#include "extensions/cocos-ext.h"
#include "ui/CocosGUI.h"

class HelloWorld : public cocos2d::Layer
{
public:
    // there's no 'id' in cpp, so we recommend returning the class instance pointer
    static cocos2d::Scene* createScene();

    // Here's a difference. Method 'init' in cocos2d-x returns bool, instead of returning 'id' in cocos2d-iphone
    virtual bool init();  

    // a selector callback
    void menuCloseCallback(cocos2d::Ref* pSender,cocos2d::ui::TouchEventType type);

    // implement the "static create()" method manually
    CREATE_FUNC(HelloWorld);
};

#endif // __HELLOWORLD_SCENE_H__

//HelloWorldScene.cpp
#include "HelloWorldScene.h"

USING_NS_CC;
//这个是命名空间
using namespace cocostudio;
using namespace ui;

Scene* HelloWorld::createScene()
{
    // 'scene' is an autorelease object
    auto scene = Scene::create();

    // 'layer' is an autorelease object
    auto layer = HelloWorld::create();

    // add layer as a child to scene
    scene->addChild(layer);

    // return the scene
    return scene;
}

// on "init" you need to initialize your instance
bool HelloWorld::init()
{
    //////////////////////////////
    // 1. super init first
    if ( !Layer::init() )
    {
        return false;
    }

    Size visibleSize = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();

	//获取我们的Cocos Studio   UIdemo
	//这里我们创建了一个widget，这里说明下貌似cocostudio有自己的一套代码风格和api
	//有些功能能和cocos2dx混合着用
	//这里的widget有点相似一个layer，反正我是这样理解的
	ui::Widget * pNode=cocostudio::GUIReader::getInstance()->widgetFromJsonFile("DemoLogin.json");
	this->addChild(pNode);

	//我们从widget中找到那个button的名字然后实例出来（跟android有点像）
	ui::Button * button=(ui::Button *)ui::Helper::seekWidgetByName(pNode,"login_Button");
	//给这个按钮添加一个touch的侦听(这边就和cocos2dx有不同了)
	button->addTouchEventListener(this,toucheventselector(HelloWorld::menuCloseCallback));

    return true;
}

//这里是侦听回调函数
void HelloWorld::menuCloseCallback(cocos2d::Ref* pSender,ui::TouchEventType type)
{
	//cocostudio的侦听，你能够依据type的类型来运行对应的代码
	//这里用switch来推断，很的简洁明了
	switch (type)
	{
	case ui::TouchEventType::TOUCH_EVENT_BEGAN:
		{
			log("touch began");
			break;
		}
	case ui::TouchEventType::TOUCH_EVENT_MOVED:
		{
			log("touch moved");
			break;
		}
	case ui::TouchEventType::TOUCH_EVENT_ENDED:
		{
			log("touch ended");
			break;
		}
	case ui::TouchEventType::TOUCH_EVENT_CANCELED:
		{
			log("touch canceled");
			break;
		}
	default:
		break;
	}
}

执行

点击button測试下

好的，完毕