Cocos Creator初学者使用龙骨动画

本文档只适于部分初次使用龙骨动画的人，不甚全面。
下面讲使用的两种情况，预设于编辑器和动态加载。
1.直接预设于编辑器中
①直接拖动xxx_ske.json的文件到层级管理器或者场景管理器下，可直接生成一个龙骨组件（需要把xxx_tex.json的文件拖到"Dragon Atlas Asset"栏）

image.png

②或者创建节点，添加渲染组件"DragonBones"，再把对应文件拖到"Dragon Asset"和"Dragon Atlas Asset"栏

以上①②两种方式添加的组件不必设置"Armature"栏
脚本中的使用方式：

// 脚本组件中的属性
@property(dragonBones.ArmatureDisplay)
dragonBones_xxx: dragonBones.ArmatureDisplay = null;

// 播放动画
let animState: dragonBones.AnimationState = this.dragonBones_xxx.playAnimation("anim", 1);
// 注册监听（需要检测动画播放时使用）
this.dragonBones_xxx.addEventListener(dragonBones.EventObject.COMPLETE, this.OnCallAnimationPlayComplete, this);
// 注销监听（不需要检测动画播放时使用）
this.dragonBones_xxx.removeEventListener(dragonBones.EventObject.COMPLETE, this.OnAnimationPlayComplete, this);
/**
* 龙骨动画回调
*/
private OnAnimationPlayComplete (_event: cc.Event): void {
  // 非循环动画播放完成（dragonBones.EventObject.LOOP_COMPLETE时循环动画播放完成一次）
  if (_event.type === dragonBones.EventObject.COMPLETE) {
    if (this.dragonBones_xxx.animationName === "anim") {
    }
  }
}
// 暂停播放动画
if (animState != null) {
  animState.stop();
}
// 继续播放动画
if (animState != null) {
  animState.play();
}

2.动态加载骨骼资源

话不多说上代码：

/**
* 动态加载怪物龙骨
* @param _monsterId
* @param resDir
* @param _callback
* @constructor
*/
public static LoadingDragonBonesData (_resDir: string, _callback: Function) : void {
  cc.loader.loadResDir(_resDir, function (error: Error, resource: any[], urls: string[]) {
    if (error != null || resource == null) {
      console.log("动态加载龙骨出错:");
      console.log(error);
      _callback(false)
      return;
     }
    console.log("动态加载龙骨完成：");
    resource.forEach(function(value: any, index: number, array: any[]) {
      if (value instanceof dragonBones.DragonBonesAsset) {
        let bones_asset: dragonBones.DragonBonesAsset  = value;
      }
      if (value instanceof dragonBones.DragonBonesAtlasAsset) {
        let bones_atlas_asset: dragonBones.DragonBonesAtlasAsset = value;
      }
    });
    _callback(true);
  });
}

// 使用加载好的龙骨文件
this.dragonBones_xxx.dragonAsset = bones_asset;
this.dragonBones_xxx.dragonAtlasAsset = bones_atlas_asset;
// 一定要设置armatureName
this.dragonBones_xxx.armatureName = "Armature";
// 播放动画（同上）
let animState: dragonBones.AnimationState = this.dragonBones_xxx.playAnimation("anim", 1);

其他的用法就和上面的一样了