如何使用CocosBuilder2.1结合cocos2d-x2.0.3创建动画场景

本为由泰然教程组成员 浅底 原创,作为一位经验丰富的游戏开发人员,这次浅底将CocosBuilder经验分享给大家,希望大家喜欢,欢迎拍砖!!转载请注明出处!!

在使用Cocos2d框架开发iOS游戏的时候,对于每一个场景(CCScene)的编辑是比较麻烦的,好在有外国的牛人提供了非常棒的场景编辑器----CocosBuilder。

作为可视化编辑的补充,cocosBuilder成为cocos2D-iphone和cocos2D-x最流行的可视化编辑器。cocos2D-x从2.0版本开始支持cocosBuilder,同样cocosBuilder也是2.0版本与之对应 , 可以通过cocosBuilder的官方网站http://cocosbuilder.com/下载cocosBuilder 。



一、 下载cocosBuilder 2.1和cocos2d-x 2.0.3版本。

二、 把自己想制作动画的资源放在一个文件夹中,命名为ccb,把cocosbuilder publish的文件,创建另一个文件夹,命名为ccbPublish。(文件夹命名随意)

wps_clip_image-15625[4]

如上图。

注:此处讲解将cocosBuilder和cocos2d-x分开来介绍,一般可以让美工人员掌握cocosBuilder,提供给编程人员ccbPublish文件夹,编程人员就可以直接读取动画文件即可,极大的缓解编程人员的工作(主要是程序员的审美木有人家的好)。

如果自己想又制作动画,又用代码来读取,下面会提到办法。

三、 打开cocosBuilder,创建工程。

File-New-New Project

wps_clip_image-15369[4]

选择ccb文件夹

wps_clip_image-6465[4]

将其命名为CCBTest,点击Save。不用管自动生成的hellococoBuilder。

四、设置工程

File-Project Setting

wps_clip_image-15901[4]

如果想在自己的Xcode中即时看到效果,此处的路劲可以选择为xcode工程中的resources文件夹。这就是上面提到的解决方法。

其他设置如图所示。

wps_clip_image-30827[4]

图中的几个选项,看英文就知道意思了。不过这里用不到。

五、创建文件File-New-New File,

wps_clip_image-21999[4]

选择iPhone4的横屏

然后

wps_clip_image-32151[4]

保存在ccb文件夹中。至此完成了初步的创建的工作。

六、创建动画

在此之前,

wps_clip_image-31667[4]

这样设置一下,可以减少阴影对自己视觉的影响。

熟悉一下

wps_clip_image-15831[4]

点击就添加一个相应的东西,之后在右侧会有相应的属性设置

wps_clip_image-12022[4]

类似xib,相信你们应该很熟悉

添加精灵之后,在相应的时间点上点击如下:

wps_clip_image-11811[4]

至少添加两个关键帧,并且是相同的。而且可以不同的动作(关键帧)同时运动。

七、保存动画,Publish动画。

常用功能键,保存是command+s,发布是command+option+S,也可以用菜单中的选项。

八、在Xcode中添加ccbPublish里面的文件,使用cocos2d-x代码读取ccbPublish中的ccbi文件。添加文件时需要注意路径一定要和cocosBuilder中的路径一致,(xcode中一般来说都是bundle路径)在工程中添加按一般的步骤来即可,若cocosBuilder文件夹中含有其他文件夹对应的是Xcode添加问价夹中,wps_clip_image-3436[4]否则会导致程序找不到相应的资源,程序崩溃。

二、程序读取cocosBuilder创建的ccbi动画文件

在程序中使用时,可以通过CCLayerLoader类注册CCNodeLoaderLibrary,再通过CCNodeLoaderLibrary类定义CCBReader类的实例,再通过readNodeGraphFromFile函数获得父节点,并把父节点加入到场景中,即可以显示出相应的场景。

1、 创建一个cocos2d-x工程。删除自动创建的helloworld文件,创建MainScene文件。

2、 在MainScene文件中读取

.h文件

#ifndef _MAIN_SCENE_h

#define _MAIN_SCENE_h

#include "cocos2d.h"

#include "cocos-ext.h"

class CCBReader;

USING_NS_CC;

USING_NS_CC_EXT;

class MainScene

: public CCLayer

, public cocos2d::extension::CCBSelectorResolver

, public cocos2d::extension::CCBMemberVariableAssigner

, public cocos2d::extension::CCNodeLoaderListener{

public:

CCB_STATIC_NEW_AUTORELEASE_OBJECT_WITH_INIT_METHOD(MainScene, create);

static CCScene* scene();

MainScene();

virtual ~MainScene();

void openTest(const char * pCCBFileName, const char * pCCNodeName = NULL, cocos2d::extension::CCNodeLoader * pCCNodeLoader = NULL);

#pragma mark -

#pragma mark Loader Function

virtual cocos2d::SEL_MenuHandler onResolveCCBCCMenuItemSelector(cocos2d::CCObject * pTarget, cocos2d::CCString * pSelectorName);

virtual cocos2d::extension::SEL_CCControlHandler onResolveCCBCCControlSelector(cocos2d::CCObject * pTarget, cocos2d::CCString * pSelectorName);

virtual bool onAssignCCBMemberVariable(cocos2d::CCObject * pTarget, cocos2d::CCString * pMemberVariableName, cocos2d::CCNode * pNode);

virtual void onNodeLoaded(cocos2d::CCNode * pNode, cocos2d::extension::CCNodeLoader * pNodeLoader);

};

#pragma mark -

#pragma mark MainSceneLoader

class MainSceneLoader:public cocos2d::extension::CCLayerLoader {

public:

CCB_STATIC_NEW_AUTORELEASE_OBJECT_METHOD(MainSceneLoader, loader);

protected:

CCB_VIRTUAL_NEW_AUTORELEASE_CREATECCNODE_METHOD(MainScene);

};

#endif

.cpp文件

#include "MainScene.h"

#include "AppController.h"

CCScene* MainScene::scene(){

CCScene *scene=CCScene::create();

cocos2d::extension::CCNodeLoaderLibrary *ccNodeLoaderLibrary=cocos2d::extension::CCNodeLoaderLibrary::newDefaultCCNodeLoaderLibrary();

ccNodeLoaderLibrary->registerCCNodeLoader("MainScene",MainSceneLoader::loader());

cocos2d::extension::CCBReader *ccBReader=new cocos2d::extension::CCBReader(ccNodeLoaderLibrary);

//屏幕适配

cocos2d::CCSize size= CCEGLView::sharedOpenGLView()->getVisibleSize();

CCLog("cpp surface size height == %f",size.height);

CCNode * node;

if (size.height==480) {

node = ccBReader->readNodeGraphFromFile("test.ccbi", scene);

}else{//iPhone5,可以为不同的设备制作不同的ccbi文件。同时创建多个画布然后制作,还没有去研究。。。

node = ccBReader->readNodeGraphFromFile("test.ccbi", scene);

}

if(node!=NULL){

scene->addChild(node);

}

return scene;

}

MainScene::MainScene(){

}

MainScene::~MainScene(){

}

void MainScene::openTest(const char * pCCBFileName, const char * pCCNodeName, cocos2d::extension::CCNodeLoader * pCCNodeLoader){

//

}

SEL_MenuHandler MainScene::onResolveCCBCCMenuItemSelector(CCObject * pTarget,CCString * pSelectorName){

//Bind Menu Events,绑定一个menu,点击方法是press,以下同理

CCB_SELECTORRESOLVER_CCMENUITEM_GLUE(this, "press",MainScene::press);

return NULL;

}

SEL_CCControlHandler MainScene::onResolveCCBCCControlSelector(CCObject * pTarget, CCString * pSelectorName){

//Bind CCControl Events

return NULL;

}

bool MainScene::onAssignCCBMemberVariable(CCObject * pTarget, CCString * pMemberVariableName, CCNode * pNode){

//Bind variables

CCB_MEMBERVARIABLEASSIGNER_GLUE(this, "ATM", CCSprite *, this->ATM);

return false;

}

void MainScene::onNodeLoaded(CCNode * pNode, cocos2d::extension::CCNodeLoader * pNodeLoader){

//检测scene

CCLOG("MainScene loading.....successed!") ;

}

3、 在appDelegate.cpp中将helloworld修改掉,

CCScene *pScene = MainScene::scene();

完成以上过程既可以读取自己创建的动画了。

这些是比较基础一些的,cocosBuidler也可以像xib一样绑定事件,对象等。上面的代码中我也有注释,若不然读取ccbi文件只需要CCScene* MainScene::scene()这个函数即可。

还也可以添加粒子效果,可以制作骨骼动画,可以为游戏制作菜单等等一系列的功能。

Cocos2d-x下载的工程中自带有一个TestCpp的工程,是我们学习cocos2d-x的非常好的源代码。其中,在wps_clip_image-7118[4]

这里面有制作的非常好的例子,把个不同的test,Animation,button,label,menu,particleSystem,Scrollview,sprite,testHeader等等,大家可以仔细研究研究。

标签: cocos2d-x, CocosBuilder

?>