在Cocos2d-x 3.4的发布日志上忽然发现他们有GAF这个动画库。研究了下,下面是关于Cocos Package Manager的使用,如何为项目添加GAF扩展。
视频:
Cocos Package Manager是一个引擎扩展模块化框架,其服务于Cocos2d-x的扩展的开发和使用流程。当扩展开发出来后,可将其上传到服务器,并用于游戏开发中。使用引擎扩展的工作流非常简单明了。以GAF为例,使用步骤如下:
-
创建一个工程:cocos new -l cpp
-
下载并安装GAF扩展:cocos package install gaf
-
进入游戏目录
-
添加GAF扩展:cocos framework add gaf
-
所有的步骤就都完成了,GAF已经被安装到包文件夹中,可以用于游戏工程中了。
好了,这样gaf就弄进你的项目了。
如果你这样做已经成功的将gaf加入到了项目中,那么,恭喜你,并且请跳过下面的内容。直接跳到GAF使用教程使用部分。
真的好了吗?no!
-
我的项目使用的是Cocos2d-x 3.3。而不是3.4。
-
gaf官方网址是 http://gafmedia.com/ 。官方提供的转换工具的最新的版本已经是4.3了(GAF Converter Version 4.3)。可,貌似使用Cocos package install gaf弄进来的是解析3.x版本的库。
我目前使用的GAF Converter版本是4.0。但今天既然在写博客,就顺便升级成了4.3。4.3版本最大的好处就是,界面可以选择中文的了。
在这里,如果哪位大神能搞个GAF Converter破解版,那我就happy了。当然,其实免费版已经完全够用了。
之前说到了github网址,现在说说分支,我使用的是gaf_4_develop分支,经过测试,master并不能在Cocos2d-x 3.3中编译通过。
首先当然是看一看Cocos2d-xGAFPlayer项目gaf_4_develop的readme.md。
支持的平台有和版本有:
-
Windows - Cocos2d-x v3.3, v3.4
-
Mac OS X - Cocos2d-x v3.3, v3.4
-
iOS - Cocos2d-x v3.3, v3.4
-
Android - Cocos2d-x v3.3, v3.4
-
Windows Phone 8 - Cocos2d-x v3.3, v3.4
-
Upcoming Linux project
至于如何将GAF加入到Cocos2d-x中,很简单:拷贝或者创建一个symlink(这个在类unix下才行,比如Mac,windows下不行的)到cocos2d-x/external/目录下。
在我的项目中,由于不想加入太多的无关的文件。所以只添加了以下两个文件夹(一个是C++库,一个是luabinding 库。其实不推荐这么做,里面的tests和sample还是有用的,团队中的其他人不一定下载了完整的Cocos2dxGAFPlayer,如果全部加进去,团队中的其他人就不用去其他地方找GAF怎样用了)。
Cocos2dxGAFPlayer里面提供了对Cocos2d-x的大力支持。提供了vs项目文件(Cocos2dxGAFPlayer\Library\GAFPlayer.vcxproj,Cocos2dxGAFPlayer\lua_bindings\proj.win32\libGAFLuaBinding.vcxproj),android.mk文件,xcode(GAFPlayer.xcodeproj,gaf_lua_bindings.xcodeproj)的工程文件,只要把这些项目文件添加到项目中去,就好了。对了,还包括GenerateProjectFiles.py,虽然我不知道怎么用,但看文件的名字的意思,应该是一个生成一个带gaf扩展的新项目的脚本。
这里只提两个地方,一个是和tolua有关的:
-
Cocos2dxGAFPlayer\lua_bindings\conversions.yaml.diff文件是一个git补丁,用于在lua/conversions.yaml文件里加入"gaf::": "gaf."。算是C++中的命名空间和lua的一个对应。
-
Android中添加luaBidnding要修改的地方,如下:
GAF使用教程
免费版的GAF用户是支持元件动画的,但貌似不支持从flash的元件中提取动画序列。还是给图说明下吧
上图是原件动画,但没费版的gaf用户是不支持的。
上图是场景动画,通过label标签,创建了seq1和seq2两个动画序列
播放效果如下,第一个gif是seq1,第二个是seq2。
好了。上面是一个logo砸下去的动画和一个“文字遮罩特效”动画。
关于“文字遮罩特效”动画。可以用【Cocos2d-x 3.2】裁剪节点(ClippingNode)总结。但偷下懒的话,就让美术实现吧。
下面是代码实现。显示创建和播放一遍动画。并设置播放结束的回调。
auto org = Director::getInstance()->getVisibleOrigin(); auto size = Director::getInstance()->getVisibleSize(); auto m_asset = gaf::GAFAsset::create("gafanim/logo_anim/logo_anim.gaf"); auto animation = m_asset->createObjectAndRun(false); this->addChild(animation, 10); animation->setPosition(Vec2(-size.width/2+200,org.y+size.height)); animation->setAnimationFinishedPlayDelegate(CC_CALLBACK_1(LayerLogo::onLogoAnimEnd, this));
在动画播放结束的回调里,去除回调,循环播放seq2动画。
void LayerLogo::onLogoAnimEnd(gaf::GAFObject* obj) { obj->setAnimationFinishedPlayDelegate(nullptr); obj->playSequence("seq2", true); }
在lua中使用,用于
// Lambda binding for lua is not supported.
。所以,setAnimationStartedNextLoopDelegate,setAnimationFinishedPlayDelegate等setXXXDelegate的函数,需要手动编写tolua文件。可以参照cocos2dx其他的(设置lua回调的函数,比如setXXEventCallback)来自己实现。
由于项目中暂时没碰到要使用gaf动画序列的情况。所以,我就没有写上面的tolua。贴一段lua版的gaf代码调用。
--玩家回合动画 local asset = gaf.GAFAsset:create("gafanim/player_round/player_round.gaf") local animation = asset:createObject() self:addChild(animation,10) local origin = cc.Director:getInstance():getVisibleOrigin() local size = cc.Director:getInstance():getVisibleSize() animation:setPosition(cc.p(origin.x,origin.y+size.height)) self.player_round_animation_ = animation
上面的代码创建了一个动画,但并没有播放。而是在代码的特定位置,这里的动画是切换到玩家回合的一个动画提示。
self.player_round_animation_:setLooped(false, true) self.player_round_animation_:start()