CubismMotionApplier

最終更新: 2023年3月14日

概述

通过使用CubismMotionApplier组件,您将能够使用Cocos Creator的AnimationController(AnimationGraph)进行动画处理。

使用时,您需要在同一个Node中安装CubismMotionApplier、CubismModel组件和Cocos Creator的AnimationController。
AnimationController组件中必须设置AnimationGraph。

请参考此处查看相关教程文章。

为了将AnimationController(AnimationGraph)中的动画应用到CubismModel的参数和部件上,进行了以下处理。

获取要操作的参数和部件参考

CubismMotionApplier.starts中,CubismModel通过设置为AnimationController(AnimationGraph)的AnimationClip进行操作,同时缓存对CubismModel的参数和部件的引用。

此时,为了根据AnimationClip中记录的Path信息查找操作对象,根据Path信息缓存Map。

if (parameters != null) {
  for (let i = 0; i < parameters.length; i++) {
    const path = makePath(parameters[i], model);
    this.parameters.set(path, new ValueCache(parameters[i]));
  }
}
if (parts != null) {
  for (let i = 0; i < parts.length; i++) {
    const path = makePath(parts[i], model);
    this.parts.set(path, new ValueCache(parts[i]));
  }
}

这个处理由CubismMotionApplier.refresh执行。

值的应用

每帧CubismMotionApplier.onLateUpdate都会计算并应用该值。

对层数重复以下处理。

根据当前播放状态调用一个处理。

此外,转换时会通过追加来处理。

this.valueUpdate(currentClipStatuses, currentStateStatus.progress);
this.valueUpdate(nextClipStatuses, nextStateStatus.progress, transProgress);

从AnimationClip中回收值

CubismMotionApplier.setCache从AnimationClip获取变更目标Path和当前值,分别调用CubismMotionApplier.setParameterCacheCubismMotionApplier.setPartCache

CubismMotionApplier.setParameterCacheCubismMotionApplier.setPartCache缓存从该AnimationClip中获取的信息用于计算。

const cache = this.parameters.get(nodePath);
if (cache == null) {
  return;
}
if (Number.isNaN(cache.calcValue)) {
  cache.calcValue = value;
} else {
  cache.calcValue = math.lerp(cache.calcValue, value, transProgress);
}

应用层权重

将预处理层和当前处理层与当前层的权重值混合。

this.parameters.forEach((cache, _key, _map) => {
  if (Number.isNaN(cache.value)) {
    cache.value = cache.calcValue;
  } else if (!Number.isNaN(cache.calcValue)) {
    cache.value = math.lerp(cache.value, cache.calcValue, layerWeight);
  }
  cache.calcValue = Number.NaN;
});
this.parts.forEach((cache, _key, _map) => {
  if (Number.isNaN(cache.value)) {
    cache.value = cache.calcValue;
  } else if (!Number.isNaN(cache.calcValue)) {
    cache.value = math.lerp(cache.value, cache.calcValue, layerWeight);
  }
  cache.calcValue = Number.NaN;
});

这个处理由CubismMotionApplier.calcCache执行。

请问这篇文章对您有帮助吗?
关于本报道,敬请提出您的意见及要求。