cocos2dx骨骼动画Armature源码分析(二)

flash中数据与xml中数据关系

上篇博文从总体上介绍了cocos2dx自带的骨骼动画,这篇介绍一下导出的配置数据各个字段的含义(也解释了DragonBone导出的xml数据每个字段的含义)。

skeleton节点

1 <skeleton name="Dragon" frameRate="24" version="2.2">
  • name:flash文件名字。
  • frameRate:flash帧率。
  • version:dragonbones版本号。

armatures节点

首先是armatures节点,截取armatures中的部分数据。

 1 <armatures>
 2     <armature name="Dragon">
 3       <b name="tail" parent="body" x="45.9" y="-70.8" kX="30" kY="30" cX="1" cY="1" pX="11.5" pY="176.35" z="10">
 4         <d name="parts-tail" pX="0" pY="-63.8"/>
 5       </b>
 6       <b name = "LegR" ... />
 7       <b/>
 8       ……
 9       <b/>
10     </armature>
11   </armatures>

<b/>节点是一个骨骼(b是bone的缩写),<armature/>节点中含有多个<b/>,是动画的整体骨骼。如下2个图所示,整个layer和骨骼之间关系就是armature节点,红框中每一个layer就是一个b节点。

<armatures>节点为什么有多个armature节点呢?因为一个flash中可能有多个骨骼动画,每个骨骼动画对应一个armature,比如下面这个flash导出后armatures里就会包含多个armature。带有帧标签的元件会被当成一个Skeleton。

<armatures name="Dragon">name属性是元件在库中的名字(下图),也是Skeleton的名字。

b节点(armature节点的子节点)

1 <b name="tail" parent="body" x="45.9" y="-70.8" kX="30" kY="30" cX="1" cY="1" pX="11.5" pY="176.35" z="10">

骨骼信息,以第一帧信息为标准。

  • name:骨骼名字,就是TimeLine中layer名字,上图。
  • parent:骨骼父节点,上图。
  • x,y:元件旋转锚点相对于父节点原点的坐标,见下图,y方向向下为正方向。

  • kX, kY:代表skewX,SkewY,一般情况2者相等,代表Rotate(旋转)大小。
  • cX, cY:代表scaleX, scaleY, 表示缩放大小。

  • pX, pY:代表pivotX, pivotY,旋转锚点相对于元件原点的坐标,下图调整了30度旋转。

  • z: 层级,最下面的layer是0层,逐上递加。

d节点

骨骼中显示节点,可以理解成皮肤,一个layer中用了几个库中的元件,就会有几个<d>节点。

1 <d name="parts-tail" pX="0" pY="-63.8"/>
  • name:显示对象的名字,为在库中路径和元件名字的拼接。

  • pX, pY: 显示对象相对于原点的位移。 

animations节点

<animations/>节点代表了骨骼随时间的变化。

 1   <animations>
 2     <animation name="Dragon">
 3       <mov name="stand" dr="7" to="6" drTW="30" lp="1" twE="0">
 4             <b name="tail" sc="1" dl="0">
 5                 <f x="45.9" y="-70.8" cocos2d_x="124.1" cocos2d_y="-229.25" kX="30" kY="30" cX="1" cY="1" pX="11.5" pY="176.35" z="10" dI="0" dr="2"/>
 6                 <f x="43.9" y="-70.8" cocos2d_x="135.5" cocos2d_y="-221.95" kX="34.95" kY="34.95" cX="1" cY="1" pX="11.55" pY="176.35" z="10" dI="0" dr="3"/>
 7                 <f x="45.9" y="-70.8" cocos2d_x="124.1" cocos2d_y="-229.25" kX="30" kY="30" cX="1" cY="1" pX="11.5" pY="176.35" z="10" dI="0" dr="2"/>
 8             </b>
 9       </mov>
10       <mov name="walk" dr="8" to="5" drTW="200" lp="1" twE="0">
11       </mov>
12       <mov name="jump" dr="5" to="3" drTW="5" lp="1" twE="NaN">
13       </mov>
14       <mov name="fall" dr="5" to="6" drTW="5" lp="1" twE="NaN">
15       </mov>
16     </animation>
17   </animations>

为什么<animations/>会有多个<animation/>呢?原因和<armatures/>中有多个<armature/>相同(见上文),animation和armature靠name属性一一对应。

mov节点

mov节点真正对应程序里面一个动画,TimeLine上一个帧标签就会产生一个mov,所以一个<animation/>中会有多个mov。

1 <mov name="stand" dr="7" to="6" drTW="30" lp="1" twE="0">
  • name:帧标签名字。
  • dr:代表duration,mov持续多少帧,上图可知stand持续7帧。
  • to:真不知道是干啥的。
  • drTW:代表duratio_tween,动画运行多长时间,1/24*7=0.29s。在dragonbones面板上设置TotalTime会影响此值。
  • lp:代表loop,是否循环播放。
  • twE:真不知道是干啥的。

b节点(mov节点的子节点)

骨骼状态,mov中会有所有的骨骼b节点。

1 <b name="tail" sc="1" dl="0">
  • name:骨骼名字
  • sc:代表movement_scale,不知是啥。总帧数调整,dragonBones面板可调整
  • dl:代表movement_delay,不知是啥。dragonBones面板中PlayDelay设置应该和其有关。

f节点

1 <f x="45.9" y="-70.8" cocos2d_x="124.1" cocos2d_y="-229.25" kX="30" kY="30" cX="1" cY="1" pX="11.5" pY="176.35" z="10" dI="0" dr="2"/>

对应关键帧信息。stand动画有3个关键帧,所以会有三个f节点。x,y,kX,kY,cX,cY,pX,pY,z与b节点(armature节点的子节点)中对应属性相同,cocos2d_xcocos2d_y也不知道怎么来的。

  • dI:display_index 显示哪个图(<armature></armature>中<b></b>中<d></d>)。
  • dr: duration 帧数.

TextureAtlas节点

dragonbone导出方式可以选择,如果选择导出大图,那么TextureAtlas节点代表了大图中小图的相关信息,可以理解成TexturePacker产生的plist文件,比如

1 <TextureAtlas name="Dragon" width="512" height="512">
2   <SubTexture/>
3   <SubTexture name="parts-tail" width="108" height="139" cocos2d_pX="0" cocos2d_pY="-63.8" x="291" y="0"/>
4   <SubTexture/>
5   <SubTexture/>
6   <SubTexture/>
7 </TextureAtlas>

SubTexture节点为小图信息,width和height为长和宽,x和y为在大图中的坐标。cocos2dpX和cocos2dpY依然不晓得有什么用

骨骼动画的配置数据就介绍到这,下一篇会介绍xml是怎么变成程序中的数据结构以及动画是如何动起来的源代码。

时间: 2024-08-01 22:41:37

cocos2dx骨骼动画Armature源码分析(二)的相关文章

cocos2dx骨骼动画Armature源码分析(三)

代码目录结构 cocos2dx里骨骼动画代码在cocos -> editor-support -> cocostudio文件夹中,win下通过筛选器,文件结构如下.(mac下没有分,是整个一坨) armature(目录): animation(目录):动画控制相关. CCProcessBase(文件): ProcessBase(类):CCTween和ArmatureAnimation的基类. CCTWeen(文件): Tween(类):控制flash里一个layer的动画. CCArmatur

【梦幻连连连】源码分析(二)

转载请注明出处:http://blog.csdn.net/oyangyufu/article/details/24736711 GameLayer场景界面效果: 源码分析: GameLayer场景初始化,主要是初始化加载界面及背景音乐 bool GameLayer::init() { float dt=0.0f; if ( !CCLayerColor::initWithColor(ccc4(255, 255, 255, 255))) { return false; } this->initLoa

[Android]Fragment源码分析(二) 状态

我们上一讲,抛出来一个问题,就是当Activity的onCreateView的时候,是如何构造Fragment中的View参数.要回答这个问题我们先要了解Fragment的状态,这是Fragment管理中非常重要的一环.我们先来看一下FragmentActivity提供的一些核心回调: @Override protected void onCreate(Bundle savedInstanceState) { mFragments.attachActivity(this, mContainer,

netty 源码分析二

以服务端启动,接收客户端连接整个过程为例分析, 简略分为 五个过程: 1.NioServerSocketChannel 管道生成, 2.NioServerSocketChannel 管道完成初始化, 3.NioServerSocketChannel注册至Selector选择器, 4.NioServerSocketChannel管道绑定到指定端口,启动服务 5.NioServerSocketChannel接受客户端的连接,进行相应IO操作 Ps:netty内部过程远比这复杂,简略记录下方便以后回忆

[Android]Volley源码分析(二)Cache

Cache作为Volley最为核心的一部分,Volley花了重彩来实现它.本章我们顺着Volley的源码思路往下,来看下Volley对Cache的处理逻辑. 我们回想一下昨天的简单代码,我们的入口是从构造一个Request队列开始的,而我们并不直接调用new来构造,而是将控制权反转给Volley这个静态工厂来构造. com.android.volley.toolbox.Volley: public static RequestQueue newRequestQueue(Context conte

哇!板球 源码分析二

游戏主页面布局 创建屏下Score标签 pLabel = CCLabelTTF::create("Score", "Arial", TITLE_FONT_SIZE); //分数标签 //设置标签字体的颜色 pLabel->setColor (ccc3(0, 0, 0)); //设置文本标签的位置 pLabel->setPosition ( ccp ( SCORE_X, //X坐标 SCORE_Y //Y坐标 ) ); //将文本标签添加到布景中 this

令人惊叹的HTML5动画及源码分析下载

HTML5非常酷,利用HTML5制作动画简直让我们忘记了这世界上还有flash的存在.今天我们要分享的一些HTML5动画都还不错,有些动画设计还是挺别出心裁的.另外,每一款HTML5动画都提供源代码下载,并且我们对源码作一些简单的分析. HTML5可爱的404页面动画 很逗的机器人 利用HTML5绘制的机器人,还会动哦.你可以将它作为一个富有创意的404页面. 核心CSS3代码: @-webkit-keyframes move { 0%, 100% { -webkit-transform: ro

baksmali和smali源码分析(二)

这一节,主要介绍一下 baksmali代码的框架. 我们经常在反编译android apk包的时候使用apktool这个工具,其实本身这个工具里面对于dex文件解析和重新生成就是使用的baksmali 和smali这两个jar包其中 baksmali是将 dex文件转换成便于阅读的smali文件的,具体使用命令如下:java -jar baksmali.jar classes.dex -o myout其中myout是输出的文件夹 而smali是将smali文件重新生成回 dex文件的具体使用的命

JAVA Collection 源码分析(二)之SubList

昨天我们分析了ArrayList的源码,我们可以看到,在其中还有一个类,名为SubList,其继承了AbstractList. // AbstractList类型的引用,所有继承了AbstractList都可以传进来 private final AbstractList<E> parent; // 这个是其实就是parent的偏移量,从parent中的第几个元素开始的 private final int parentOffset; private final int offset; int s