CocosCreator官方示例 - spine系列

1.动态加载spine动画

  • 挂载spine动画依赖sp.Skeleton组件

  • 设置spine动画三个重要的属性，也可以代码动态设置
Skeleton Data骨骼信息数据，拖拽 Spine 导出后的骨骼资源到该属性中
Default Skin选择默认的皮肤
Animation

当前播放的动画名称

  • 通过代码加载，读取assets/resources目录下的资源初始化spine动画

    cc.loader.loadRes('loadSpine/alien-ess', sp.SkeletonData, this.onProcess.bind(this), this.onComplete.bind(this));

  • 在onComplete回调里执行下面操作

    let spine = this.getComponent('sp.Skeleton');

    spine.skeletonData = res;

    let animate = spine.setAnimation(0, 'run', true);

这样就完成了动态加载spine动画

2.spine动画的动作

  • setMix(fromAnimation, toAnimation, duration)

为所有关键帧设定混合及混合时间（从当前值开始差值）

说白了就是两个动作切换时，不在是生硬的切换，而是上一个动作快结束时，下一个动作开始进入

具体详情点击 https://www.cnblogs.com/BigFeng/p/6781855.html

  • setAnimation(trackIndex, name, loop)

设置当前动画。队列中的任何的动画将被清除，返回一个 sp.spine.TrackEntry 对象。

set相同的trackIndex 上一个动作会被覆盖

假如trackIndex == 0是walk动作，此时想播放射击动作，因为walk动作不能停下，那么就将shoot动作的trackIndex设置为1

  • addAnimation(trackIndex, name, loop, delay)

添加一个动画到动画队列尾部，还可以延迟指定的秒数，返回一个 sp.spine.TrackEntry 对象

3.Spine 换装

具体详见 https://docs.cocos.com/creator/2.2/manual/zh/components/spine.html#spine-%E6%8D%A2%E8%A3%85

  • 部分换装

简单点说就是通过替换 findSlot 插槽的 attachment 对象，产生局部换装的效果，attachment 对象的是通过 findSlot 找到的

下面是spine动画的部分json数据

  • 整体换装

setSkin('goblin')

setSlotsToSetupPose()