骨骼动画资源(Spine)

Creator 中的骨骼动画资源是由 Spine 编辑器 导出的,目前支持 JSON二进制 两种数据格式。

各 Creator 版本对应支持的 Spine 版本如下所示:

Creator 版本Spine 版本
v3.0 及以上v3.8(原生平台不支持特定版本 v3.8.75)
v2.3 及以上v3.8
v2.2v3.7
v2.0.8~v2.1v3.6
v2.0.7 及以下v2.5

导入骨骼动画资源

骨骼动画所需资源有:

  • .json/.skel 骨骼数据
  • .png 图集纹理
  • .txt/.atlas 图集数据

    spine

创建骨骼动画

资源管理器 中将骨骼动画资源拖动到 属性检查器 Spine 组件的 SkeletonData 属性中:

spine

从服务器远程加载 Spine

加载文本格式的 Spine 资源

  1. let comp = this.getComponent('sp.Skeleton') as sp.Skeleton;
  2. let image = "http://localhost/download/spineres/1/1.png";
  3. let ske = "http://localhost/download/spineres/1/1.json";
  4. let atlas = "http://localhost/download/spineres/1/1.atlas";
  5. assetManager.loadAny([{ url: atlas, ext: '.txt' }, { url: ske, ext: '.txt' }], (error, assets) => {
  6. assetManager.loadRemote(image, (error, texture: Texture2D) => {
  7. let asset = new sp.SkeletonData();
  8. asset.skeletonJson = assets[1];
  9. asset.atlasText = assets[0];
  10. asset.textures = [texture];
  11. asset.textureNames = ['1.png'];
  12. skeleton.skeletonData = asset;
  13. });
  14. });

加载二进制格式的 Spine 资源

  1. let comp = this.getComponent('sp.Skeleton') as sp.Skeleton;
  2. let image = "http://localhost/download/spineres/1/1.png";
  3. let ske = "http://localhost/download/spineres/1/1.skel";
  4. let atlas = "http://localhost/download/spineres/1/1.atlas";
  5. assetManager.loadAny([{ url: atlas, ext: '.txt' }, { url: ske, ext: '.bin' }], (error, assets) => {
  6. assetManager.loadRemote(image, (error, texture: Texture2D) => {
  7. let asset = new sp.SkeletonData();
  8. asset._nativeAsset = assets[1];
  9. asset.atlasText = assets[0];
  10. asset.textures = [texture];
  11. asset.textureNames = ['1.png'];
  12. asset._uuid = ske; // 可以传入任意字符串,但不能为空
  13. asset._nativeURL = ske; // 传入一个二进制路径用作 initSkeleton 时的 filePath 参数使用
  14. comp.skeletonData = asset;
  15. let ani = comp.setAnimation(0, 'walk', true);
  16. });
  17. });