Pose (Cocos Creator)

最終更新: 2023年3月14日

概要

Poseは、Poseの設定形式の.pose3.jsonに記述されたパーツ群の表示状態を管理する機能です。
Poseを使用することで、「下ろした状態の腕」と「組んだときの腕」のように、画面には同時に表示させたくないパーツを管理することができます。
また、Poseを利用することで、PartのIDが異なるモデル(衣装替え等)にも対応することが可能です。

.pose3.jsonは、Cubism Viewer for OWで設定することができます。
パーツの設定方法などの詳細につきましては こちら をご覧ください。

OW方式でインポートしたモデルと、従来方式のモデルとを比較した場合、Poseによって以下の3点が変化します。

  • [Prefabのルート]/Parts/ 以下のGameObjectに、CubismPosePartがアタッチされる。
  • AnimationClip内のPartOpacityのカーブがSteppedで合った場合、Linearカーブに加工される。
  • AnimationClipから、pose3.jsonに記述されていないOpacityカーブが削除される。

Poseでは、以下の処理を行います。

  1. Poseモーション内にSteppedで設定されたPartsのOpacity(不透明度)のカーブを加工
  2. Pose用パーツを特定
  3. 表示するPoseパーツを判別するためパーツのOpacityを保存
  4. Poseの計算と適用
  5. 不透明度の連動

Poseモーション内にSteppedで設定されたPartsのOpacity(不透明度)のカーブを加工

Editor マニュアルの ポーズの設定 に記述されている通り、Poseで扱うパーツの不透明度(PartOpacity)用のカーブは、カーブの種類はステップ(Stepped)を前提としております。
Cubism SDK for Cocos Creatorでは、このカーブをリニア(Linear)に加工してAnimationClipに書き出します。

Stepped以外の種類のカーブを設定した場合、そのカーブは加工されずそのままAnimationClipに書き出します。

if (
  shouldImportAsOriginalWorkflow &&
  poseJson != null &&
  poseJson.adeInTime != 0.0
) {
  let track = CubismMotion3Json.convertSteppedCurveToLinerCurver(
    curve,
    poseJson.fadeInTime
  );
}

このOpacityのカーブを加工する処理は、 CubismMotion3Json.toAnimationClipB() で行っています。

Pose用パーツを特定

CubismPosePartは、OW方式でモデルをインポートした時にアタッチされます。
アタッチする Node は、[Prefabのルート]/Parts/ 以下に配置された、.pose3.json に記述された ID と同名のものになります。

// Pose用パーツを取得
const part = ArrayExtensionMethods.findByIdFromParts(
  parts,
  group[partIndex].id
);

// CubismPosePartをアタッチ
posePart = part.node.addComponent(CubismPosePart)!;

// Poseの情報をCubismPosePartに設定
posePart.groupIndex = groupIndex;
posePart.partIndex = partIndex;
posePart.link = group[partIndex].link;

表示するPoseパーツを判別するためパーツのOpacityを保存

現在の CubismPart.opacity の値を、前フレームにキャッシュした値と比較することで、.pose3.json に記述されたグループ内の表示パーツを判別します。
値のキャッシュは CubismPoseController.savePartOpacities() で行っています。

Poseの計算と適用

表示パーツの適用はAnimatinoClipで適用します。

非表示パーツの適用は CubismPoseController.doFade() で行ないます。

非表示パーツのOpacityは表示するパーツの不透明度との関係で背景が透けないレベルで不透明度を低下させます。
CubismPoseController.doFade()では表示パーツを探してから、非表示パーツ Opacity を設定します。

不透明度の連動

不透明度の連動は Pose の適用後、Opacity を CubismPosePart.link に書かれた連動パーツは CubismPoseController.copyPartOpacities で Opacity を設定します。

この記事はお役に立ちましたか?
はいいいえ
この記事に関するご意見・
ご要望をお聞かせください。