使用CocosBuilder2.1结合cocos2dx2.0.3创建动画场景

原文地址:http://article.ityran.com/archives/2140

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

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

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

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

二、 把自己想制作动画的资源放在一个文件夹中&＃xff0c;命名为ccb&＃xff0c;把cocosbuilder publish的文件&＃xff0c;创建另一个文件夹&＃xff0c;命名为ccbPublish。&＃xff08;文件夹命名随意&＃xff09;

如上图。

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

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

三、 打开cocosBuilder&＃xff0c;创建工程。

File-New-New Project

选择ccb文件夹

将其命名为CCBTest&＃xff0c;点击Save。不用管自动生成的hellococoBuilder。

四、设置工程

File-Project Setting

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

其他设置如图所示。

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

五、创建文件File-New-New File&＃xff0c;

选择iPhone4的横屏

然后

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

六、创建动画

在此之前&＃xff0c;

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

熟悉一下

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

类似xib&＃xff0c;相信你们应该很熟悉

添加精灵之后&＃xff0c;在相应的时间点上点击如下&＃xff1a;

至少添加两个关键帧&＃xff0c;并且是相同的。而且可以不同的动作&＃xff08;关键帧&＃xff09;同时运动。

七、保存动画&＃xff0c;Publish动画。

常用功能键&＃xff0c;保存是command&＃43;s&＃xff0c;发布是command&＃43;option&＃43;S&＃xff0c;也可以用菜单中的选项。

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

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

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

1、 创建一个cocos2d-x工程。删除自动创建的helloworld文件&＃xff0c;创建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 &＃61; NULL, cocos2d::extension::CCNodeLoader * pCCNodeLoader &＃61; NULL);#pragma mark -#pragma mark Loader Functionvirtual 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 MainSceneLoaderclass 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&＃61;CCScene::create();cocos2d::extension::CCNodeLoaderLibrary *ccNodeLoaderLibrary&＃61;cocos2d::extension::CCNodeLoaderLibrary::newDefaultCCNodeLoaderLibrary();ccNodeLoaderLibrary->registerCCNodeLoader("MainScene",MainSceneLoader::loader());cocos2d::extension::CCBReader *ccBReader&＃61;new cocos2d::extension::CCBReader(ccNodeLoaderLibrary);//屏幕适配cocos2d::CCSize size&＃61; CCEGLView::sharedOpenGLView()->getVisibleSize();CCLog("cpp surface size height &＃61;&＃61; %f",size.height);CCNode * node;if (size.height&＃61;&＃61;480) {node &＃61; ccBReader->readNodeGraphFromFile("test.ccbi", scene);}else{//iPhone5&＃xff0c;可以为不同的设备制作不同的ccbi文件。同时创建多个画布然后制作&＃xff0c;还没有去研究。。。node &＃61; ccBReader->readNodeGraphFromFile("test.ccbi", scene);}if(node!&＃61;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&＃xff0c;绑定一个menu&＃xff0c;点击方法是press&＃xff0c;以下同理CCB_SELECTORRESOLVER_CCMENUITEM_GLUE(this, "press",MainScene::press);return NULL;}SEL_CCControlHandler MainScene::onResolveCCBCCControlSelector(CCObject * pTarget, CCString * pSelectorName){//Bind CCControl Eventsreturn NULL;}bool MainScene::onAssignCCBMemberVariable(CCObject * pTarget, CCString * pMemberVariableName, CCNode * pNode){//Bind variablesCCB_MEMBERVARIABLEASSIGNER_GLUE(this, "ATM", CCSprite *, this->ATM);return false;}void MainScene::onNodeLoaded(CCNode * pNode, cocos2d::extension::CCNodeLoader * pNodeLoader){//检测sceneCCLOG("MainScene loading.....successed!") ;}

3、 在appDelegate.cpp中将helloworld修改掉&＃xff0c;

CCScene *pScene &＃61; MainScene::scene();

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

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

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

Cocos2d-x下载的工程中自带有一个TestCpp的工程&＃xff0c;是我们学习cocos2d-x的非常好的源代码。其中&＃xff0c;在

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