[cocos2dx开发技艺2]工具CocosBuilder的使用-集成

[cocos2dx开发技巧2]工具CocosBuilder的使用--集成

CocosBuilder工程会产生3类文件，后缀分别为ccbproj, ccb, ccbi（其中前两个文件使工程文件－－ccb.ccbproj, apple.ccb。      ccbi文件，是导出的文件，被cocos2dx程序使用，如上图的apple.ccbi）；

2）配置cocosBuilder属性点击菜单File/Publish Setting..., 弹出如下对话框：
按上图进行配置，其中最为重要的是选择导出ccbi的目录，这里将设置为cocos2dx的Resources目录，就是cocosBuilder的上级目录。然后勾选最后的“Flatten paths when publishing”和“Only publish ccb-files”选项。
观察ccb/Resources目录，其中有个ccbResources文件，这里面放ccb使用的图片等资源。在ccb发布成ccbi后，我们还需要把此ccbResources拷贝到cocos2dx的resources目录下，这样ccbi才可以正确的读取。
3）创建ccb文件。菜单File/New/New File..., 弹出如下的对话框：

这里可以创建4类Object，CCLayer, CCNode, CCParticleSystemQuad和CCSprite；这里还可以选择游戏运行的device的类型，保持默认，点击create后，给定名称（这里为MainScene.ccb），选择ccb/Resources为其根目录，就生成了一个ccb文件。操作界面如下图：
点击界面下方时间轴中的物体，其构成了树状结构（这个正是cocos2dx中对CCNode的构成结构）；选择其中一项，比如CCLayer，其右方将显示其相关属性。比如Position， ContentSize，AnchorPoint等信息。当cocosBuilder生成ccbi的时候，将导出这些信息（文件为二进制形式，其中还包含动画信息和回调函数的信息；动画信息在操作界面的下方定义）。cocos2dx在载入这个ccbi文件的时候，将调用相关解析器（CCBReader）来解析这个文件，生成相应的cocos2dx对象，然后呈现出来，并播放相应的动画。
4）编辑ccb文件－－按钮在cocosBuilder的编辑，都是“可见即可得”的。cocosBuilder兼容SpriteSheet（可以使用TexturePacker进行编辑），编辑的时候，直接把图片拖动到模拟器就可以了。
创建按钮有两种方式（和cocos2dx中一样），这里只介绍使用Menu的方式。先创建Menu，点击工具栏中的Menu按钮（左边），如下图：
在当前的Menu中，然后点击Menu按钮的右边5下，就创建了5个MenuItem。类的层次结构，可以在时间轴边上看到。如下图：
创建的按钮如下图：
这时需要在右侧的设置属性，如下图：
设置事件响应函数的名称（如btnPlay，target为Document root）；并设置CCMenuItem在三种不同情况下的呈现的图片。完成的按钮如下：

配置完5个按钮，调整位置和缩放等，如下：


4）编辑ccb文件－－动画这里将运用cocosBuilder来制作背景中的一个闪烁的星星，具体使用的是Rotate和Scale动画。将一颗星星拖入到模拟器中，并移动到右上角，如下图：选中这个物体，先缩放其为0.1f； 然后在事件轴中的0s和2s处，分别按快捷键v, r和s，创建Visible,Rotate和Scale的关键帧（对应菜单Animations/Insert Keyframe中的相关选项），在1s处，创建scale关键帧；如下图：
点击Scale在1s处的关键帧，做适当的放大和旋转操作。点击播放按钮，或者手工拖动，可以参看效果。

目前动画只会播放一次，在cocosBuilder中设置循环播放，很简单，在时间轴的下方选择chain TimeLine为自身就可以了，如下图：
这个原理就是，当播放完当前的TimeLime之后，接着再播放此timeline，这样就循环起来的了。
关于timeLine，还可以设置其播放时间（默认为10s），点击时间轴上方的时间：
在弹出的对话框中设置就可以了：

还可以创建多个时间轴，

按照上面的循环动画的方式，也可以串起来做复杂的动画。这些动画也可以在cocos2dx代码中被调用。十分的灵活方便。

代码的集成当cocosBuilder完成对ccb的编辑之后，点击菜单File/Publish, 导出ccb成为ccbi文件到cocos2dx的Resources文件目录下了（请参考上面的“配置cocosBuilder属性”）。然后在xcode中把ccbResources目录和相应的ccbi文件加入到工程中，这样就可以进行代码编辑了。代码的集成，其实就是解析ccbi文件的过程，cocos2dx中针对cocosBuilder有相应的解析器CCBReader（位于extensions/CCBreader目录下，CCBReader和CocosBuilder的版本有关系，请参考文末的“版本说明”）；由于C++没有像Object－C的动态特性，所以集成CCBReader的代码并没有像cocos2d中那么简单。不过理解其原理，理清思路后，其实也不是件困难的事情。
所以，先讲CCBReader的原理。ccbi文件其实对应了4类cocos2dx对象，一个ccbi文件中，包含了此对象的一些属性信息。CCBReader读取了这个ccbi文件，就清楚了这个对象的一切。这个时候，要把这些信息和我们的代码联系起来，就需要用CCNodeLoaderLibrary来联系自定义的类，接着把这个信息抛给CCBReader，由其进行联系。具体代码如下：

选择CCLayer，在右侧的Custom class中填写Intro。（如果是Custom class显示为 JS Controller，点击菜单Document/JavaScipt Controlled, 去掉其选项）。这个就可以理解上面的代码了：
#ifndef ShootTheApple_CcbBase_h#define ShootTheApple_CcbBase_h#include "cocos2d.h"#include "cocos-ext.h"#include "Box2D.h"USING_NS_CC;USING_NS_CC_EXT;class CcbBase: public cocos2d::CCLayer, public cocos2d::extension::CCBSelectorResolver, public cocos2d::extension::CCBMemberVariableAssigner, public cocos2d::extension::CCNodeLoaderListener{public:    virtual cocos2d::SEL_MenuHandler onResolveCCBCCMenuItemSelector(cocos2d::CCObject * pTarget, const char * pSelectorName) {        // do nothing        //CCB_SELECTORRESOLVER_CCMENUITEM_GLUE(this, "onPlay", Playground::btnPlay);        return NULL;    }    virtual cocos2d::extension::SEL_CCControlHandler onResolveCCBCCControlSelector(cocos2d::CCObject * pTarget, const char * pSelectorName) {        // do nothing        return NULL;    }    virtual bool onAssignCCBMemberVariable(cocos2d::CCObject * pTarget, const char * pMemberVariableName, cocos2d::CCNode * pNode) {        // do nothing        //CCB_MEMBERVARIABLEASSIGNER_GLUE(this, "apple", CCSprite *, this->apple);        return NULL;    }    virtual bool onAssignCCBCustomProperty(CCObject* pTarget, const char* pMemberVariableName, cocos2d::extension::CCBValue* pCCBValue) {        // do nothing        return false;    }    virtual void onNodeLoaded(cocos2d::CCNode * pNode, cocos2d::extension::CCNodeLoader * pNodeLoader) {        // do nothing    }};#endif

CCReader进行ccbi和自定义类的联系的过程如下，CCBReader一边解析ccbi文件，一边调用自定义类的onResolveCCBCCMenuItemSelector等方法；在这些回调方法中，可以进行相关的绑定工作，如对象绑定，CCMenuItem selector的绑定等。更多的绑定细则，请参考cocosBuilder中的帮助。
如果用Object－C就方便多了，由于其动态性，可以根据名称自动反射，而C++则需要手工绑定，繁琐些，不过为了cocosBuilder带来的方便，这个也值得。
下一篇文章介绍怎么使用CocosBuilder加快Box2d的开发
版本说明
在这个demo中，cocosBuilder的版本为Version 3 alpha3，配套的cocos2dx版本为cocos2d-2.1rc0-x-2.1.2；
cocosBuilder的官方：http://cocosbuilder.com/
cocosBuilder官方教程：https://github.com/vlidholt/CocosDragon/blob/master/Tutorial/Tutorial.md
cocos2dx的相关页面：http://www.cocos2d-x.org/news/95
 

 

查看更多 下一篇