一、前言
关于骨骼动画,如果大家不知道是什么东东的话,可以先百度一下。
如果大家有去玩过我介绍的《BattleHeart》的话,你会发现,里面用到的就是骨骼动画,而且骨骼动画有几个帧序列动画无法比拟的优点:
1)不需要太多的资源,就可以实现多种动画
2)动画效果可以自行设置(很适合像我这种没有美工MM辅助的苦逼)
3)可以随意替换,如果你有认真观察《BattleHeart》的话,你会发现,当你的英雄换了一把剑的时候,战斗的时候就用那一把剑。就是说能实现简单的换装同步。
二、正文
下面开始介绍怎么使用骨骼动画。
不得不提,cocos2dx提供了很好很强大的工具cocostudio给我们使用,使用cocostudio我们就可以很轻松地创建骨骼动画并且在项目中使用。
这里我的cocostudio版本是1.6(貌似现在已经升到2.0了)
1.在cocostudio1.6中创建一个火柴人
打开cocostudio1.6并选择动画编辑器,并且选择新建项目,进入如下界面
窗口介绍:
最右边:Resource里面放入你需要用到的资源,注意骨骼动画里面用到的资源一般是一段段的(如前手臂,后手臂,头等)
左上角:形体模式,你可以把形体模式当做就是静态模式,通常创建骨骼动画都是先在形体模式上搭好一个人。
其实这个动画编辑器做得挺简单的,可以自己摸索一下
第一步 :
导入所需资源,并且拼好一个人。就像玩拼图那样拼就好了。
第二步:
创建骨骼,可以这样理解,资源图片只是皮肤,一个动画真正动的是骨骼,骨骼带动皮肤。点击工具栏里面的创建骨骼按钮,即可以在我们的"皮肤"上面创建一根骨骼,需要注意的是,骨骼有主次方向之分,就是说最好中主心骨中拉出一根骨骼出来,例如我这个主心骨就是上半身,那就先创建上半身这根骨头,再从这根骨头向外扩展。这个不好描述,大家用一下就应该会有感觉了。骨骼拉完之后是这个样子的。由于我的火柴人是黑色的不好观看骨骼,所以我选择了全部,方便观察,基本上每一段就对应一根骨头
第三步:
对每一个骨骼右击,设置骨骼的父子关系,并且对每个资源右击,骨骼和资源绑定。设置父子关系,就是说谁要根据谁来转动,当父转动时,子也随之转动。好比人的前手臂和后手臂的关系,你可以只动你的前手臂(子),保持后手臂(父)不动。但是你不可能做到只动你的后手臂(父)而不动你的前手臂(子)吧。。好吧,至少我是做不到。骨骼跟资源绑定很好理解,就是让骨骼跟皮肤一一对应起来。绑定完之后基本没变化,这里就不截图了。前面已经说了,形体模式主要是负责人在不动的时候的布局,到此形体模式的工作已经做完了。
第四步:
点击左上方的形体模式按钮,切换到动画模式,界面如下。
如果有玩过Flash的,那就简单了,这不就是一个简化版的Flash动画编辑器吗。
左边动作列表:是你动作(动画)的名称,最好修改一下,因为以后在代码中调用需要用到这个名称。
中间动画帧:对于学过Flash的同学应该不用解释这是什么了,没学过的可以理解为一张张图片连续播放的序列
第五步:添加关键帧,修改关键帧的位置,旋转,大小等属性
接下来的步骤就跟flash一模一样了,cocostudio也是自动创建补间动画的,所以只需要添加关键帧并且修改关键帧的属性就好了。
在关键帧中可以旋转火柴人的身体以修改属性,很方便。做完之后记得点击播放键看看哦。很好玩吧。
第六部:导出项目。
2.在cocos2dx项目中导入骨骼动画
在项目中导入骨骼动画很方便,毕竟有专门的类
ArmatureDataManager::getInstance()->addArmatureFileInfo("NewAnimation0.png" , "NewAnimation0.plist" , "NewAnimation.ExportJson");
Armature *armature = Armature::create( "NewAnimation");
armature->setPosition(Point(visibleSize.width * 0.5, visibleSize.height * 0.5));
// 播放动画
armature->getAnimation()->play("walk");
this->addChild(armature);
addArmatureFileInfo的三个参数分别对应从cocostudio里面导出的那三个文件
Armature::create()的参数是项目名
armature的play函数的参数就是刚刚我们创建动画的名字。
3.在cocos2dx项目中相关配置
假如大家不会再cocos2dx-VS项目中配置cocostudio,这里给出一个很好的博客网址供大家参考
http://blog.sina.com.cn/s/blog_6d193c030101hbnf.html
至此,如何使用骨骼动画就介绍到这里了。这里附带我这个《Flighting》的这个美术资源包,骨骼动画在BoneAnimate文件夹里面
《Flighting》资源:点击打开链接
我的csdn地址:http://blog.csdn.net/hezijian22
邮箱地址:578690286@qq.com
如有问题或指教,请于我交流,谢谢。