animation du squelette cocos2dx Analyse du code source de l'armature (2)_compétences javascript

L'article précédent a présenté l'animation squelettique fournie avec cocos2dx en général. Cet article présente la signification de chaque champ des données de configuration exportées (il explique également la signification de chaque champ des données XML exportées. par DragonBone signifiant).

nœud squelette

<skeleton name="Dragon" frameRate="24" version="2.2">

nom : nom du fichier flash.

frameRate : fréquence d'images du flash.

version : numéro de version de Dragonbones.

noeud d'armatures

Le premier est le nœud armatures, qui intercepte certaines données dans les armatures.

 <armatures>
  <armature name="Dragon">
  <b name="tail" parent="body" x="." y="-." kX="" kY="" cX="" cY="" pX="." pY="." z="">
   <d name="parts-tail" pX="" pY="-."/>
  </b>
  <b name = "LegR" ... />
  <b/>
  ……
  <b/>
  </armature>
 </armatures>

Le nœud est un os (b est l'abréviation de os). Le nœud contient plusieurs , qui est le squelette global de l'animation. Comme le montrent les deux figures suivantes, la relation entre la couche entière et les os est le nœud d'armature, et chaque couche dans la case rouge est un nœud b.

Pourquoi le nœud possède-t-il plusieurs nœuds d'armature ? Comme il peut y avoir plusieurs animations de squelette dans un flash, chaque animation de squelette correspond à une armature. Par exemple, après avoir exporté le flash ci-dessous, les armatures contiendront plusieurs armatures. Les composants avec une balise frame sont traités comme un squelette.

L'attribut name est le nom du composant dans la bibliothèque (image ci-dessous), qui est également le nom du Squelette.

nœud b (nœud enfant du nœud d'armature)

<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">

Informations sur le squelette, basées sur les informations de la première image.

name : Le nom de l'os est le nom du calque dans TimeLine, comme indiqué ci-dessus.

parent : nœud parent osseux, illustré ci-dessus.

x, y : les coordonnées du point d'ancrage de rotation du composant par rapport à l'origine du nœud parent, comme le montre la figure ci-dessous, la direction y est vers le bas comme direction positive.

kX, kY : représente skewX et SkewY. Généralement, les deux sont égaux et représentent la taille de rotation (rotation).

cX, cY : représente scaleX, scaleY, représente la taille du zoom.

pX, pY : représente pivotX, pivotY, les coordonnées du point d'ancrage de rotation par rapport à l'origine du composant. La figure suivante ajuste la rotation de 30 degrés.

z : Niveau, la couche inférieure est la couche 0, augmentant une à une.

nœud d

Les nœuds affichés dans le squelette peuvent être compris comme du skin. Si plusieurs composants de la bibliothèque sont utilisés dans un calque, il y aura plusieurs nœuds

 <d name="parts-tail" pX="0" pY="-63.8"/>

name : affiche le nom de l'objet, qui est la concaténation du chemin et du nom du composant dans la bibliothèque.

pX, pY : Afficher le déplacement de l'objet par rapport à l'origine.

nœud d'animations

Le nœud

représente l'évolution du squelette au fil du temps.

<animations>
  <animation name="Dragon">
  <mov name="stand" dr="" to="" drTW="" lp="" twE="">
    <b name="tail" sc="" dl="">
     <f x="." y="-." cocosd_x="." cocosd_y="-." kX="" kY="" cX="" cY="" pX="." pY="." z="" dI="" dr=""/>
     <f x="." y="-." cocosd_x="." cocosd_y="-." kX="." kY="." cX="" cY="" pX="." pY="." z="" dI="" dr=""/>
     <f x="." y="-." cocosd_x="." cocosd_y="-." kX="" kY="" cX="" cY="" pX="." pY="." z="" dI="" dr=""/>
    </b>
  </mov>
  <mov name="walk" dr="" to="" drTW="" lp="" twE="">
  </mov>
  <mov name="jump" dr="" to="" drTW="" lp="" twE="NaN">
  </mov>
  <mov name="fall" dr="" to="" drTW="" lp="" twE="NaN">
  </mov>
  </animation>
 </animations>

Pourquoi a-t-il plusieurs  ? La raison est la même qu'il y a plusieurs dans (voir ci-dessus), l'animation et l'armature correspondent une à une par l'attribut name.

nœud mov

Le nœud mov correspond en fait à une animation dans le programme. Une étiquette d'image sur TimeLine générera un mov, il y aura donc plusieurs mouvements dans une seule .

<mov name="stand" dr="7" to="6" drTW="30" lp="1" twE="0">

name : nom de l'étiquette du cadre.

dr : représente la durée, combien d'images dure le mouvement. Comme le montre la figure ci-dessus, le support dure 7 images.

à : Je ne sais vraiment pas ce que ça fait.

drTW : signifie durée_tween, durée de l'animation, 1/24*7=0,29 s. La définition de TotalTime sur le panneau dragonbones affecte cette valeur.

lp : signifie boucle, qu'il faut boucler ou non.

twE : Je ne sais vraiment pas ce que ça fait.

nœud b (nœud enfant du nœud mov)

Statut de l'os, il y aura tous les nœuds de l'os b dans le mouvement.

 <b name="tail" sc="1" dl="0">

name:骨骼名字

sc：代表movement_scale,不知是啥。总帧数调整，dragonBones面板可调整

dl：代表movement_delay,不知是啥。dragonBones面板中PlayDelay设置应该和其有关。

f节点

 <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_x和cocos2d_y也不知道怎么来的。

dI:display_index 显示哪个图(中中)。

dr: duration 帧数.

TextureAtlas节点

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

 <TextureAtlas name="Dragon" width="" height="">
 <SubTexture/>
 <SubTexture name="parts-tail" width="" height="" cocosd_pX="" cocosd_pY="-." x="" y=""/>
 <SubTexture/>
 <SubTexture/>
 <SubTexture/>
 </TextureAtlas>

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

以上内容是脚本之家的小编给大家分享的cocos2dx骨骼动画Armature源码剖析(二)，后续还有更近，请持续关注本站。