前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >cocos2d-js V3.0 V3.1使用DragonBones

cocos2d-js V3.0 V3.1使用DragonBones

作者头像
用户1258909
发布2018-07-03 15:57:24
1.6K1
发布2018-07-03 15:57:24
举报
文章被收录于专栏:拂晓风起拂晓风起

DragonBones是Adobe支持的一个开源项目,用于制作和播放骨骼动画,官网地址是:http://dragonbones.effecthub.com/。DragonBones首先在Flash和Starling引擎上使用,后续继续推广支持多个游戏引擎,现在已经能很好的支持HTML5和cocos2d-x。

wps_clip_image-4544
wps_clip_image-4544

DragonBones提供了Flash的插件,用于生成骨骼动画文件,称为DragonBonesDesignPanel,结合Flash和DragonBonesDesignPanel可以很方便的完成骨骼动画制作。相对而言,DragonBones在制作上比Cocos Studio的动画编辑器更方便,也更符合设计师的使用习惯,因为大部分设计师都有Flash使用经验。

由于cocos2d-js V3.1只支持2.0到2.2版本的DragonBonesDesignPanel,所以我们不能直接使用官网提供的最新版DragonBonesDesignPanel。我们只能使用cocos团队修改过的DragonBonesDesignPanel V2.0,访问http://www.cocoachina.com/bbs/read.php?tid=154886下载。说起这个2.0版本的下载地址,一把辛酸泪啊。只相隔那么一年,cocos的论坛由于做了合并,原来的帖子地址都变了,而DragonBones这种外来物种,没有足够地位,cocos团队都忘记这个DragonBonesDesignPanel V2.0了。笔者我好不容易才翻箱倒柜找到这个下载地址。

另外,网上也有高手(zrong)制作了专门支持cocos2d的DragonBonesDesignPanel V2.2版本,下载地址是:https://github.com/zrong/dragonbones-for-cocos2d-x/tree/master/build

额外提醒一下,安装DragonBonesDesignPanel后,这个插件会自动升级,如果过一段时间发现cocos2d-js无法加载DragonBonesDesignPanel导出的文件,就要拿出旧版的安装文件重新安装了。

另外,由于DragonBones和Cocos2d-js都是开源的, 所以如果还有进一步问题,我们可以学习一下zrong,自己动手修改代码。当然,你需要知道怎么用Flash builder。。。说到DragonBones源代码也是一个纠结的事,官方并没有放出所有历史版本,害得我也是累死累活的才找到V2.2和V2.0的版本回来做比较。分享给大家:

只需要按照DragonBones的制作规范制作动画,再使用修改版的DragonBonesDesignPanel,就可以轻松在cocos2d-js加载DragonBones骨骼动画。

如果使用zrong的版本,导出时直接选择cocos2d版本,导出的是plist、大图和xml;而cocos提供的2.0版本则导出碎图+xml,我们还需要另行把碎图变成Spritesheet。

加载的代码很简单:

代码语言:javascript
复制
        ccs.armatureDataManager.addArmatureFileInfo("res/dragonbones/skeleton.png", "res/dragonbones/skeleton.plist", "res/dragonbones/skeleton.xml");

        var armature = new ccs.Armature("Dragon");

        armature.getAnimation().play("stand");

        armature.getAnimation().setSpeedScale(24/60);

播放时,大家可能会发现卡顿或跳动的情况,那是因为在cocos2d-js中使用DragonBones,还有一个额外的规范。每个动作的最后一帧需要把所有的部件回位,否则就出现跳动。因为最后一帧到第一帧这个过程,DragonBones自己的运行库会做平缓过度,而cocos2d-js解析则没有这个过度,所以我们就要自己动手加一帧了。

wps_clip_image-6699
wps_clip_image-6699

凑合着,还是可以用起来了。不过,cocos2d-js肯定比不上DragonBones官方自己的运行库了,而现在DragonBones已经有C++版本了:https://github.com/DragonBones/DragonBonesCPP,说白了就是为了支持cocos2d-x。我们可以考虑自行加上js绑定,从而让cocos2d-js也用上最新版的DragonBones。咳咳,当然,这个工作得有需求推动啊,如果有时间的话,笔者也许会尝试一下吧。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2014-12-15 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档