【Native】乗算色・スクリーン色

最終更新： 2022年5月19日

モデルに乗算色・スクリーン色を適用することで、色合いをリアルタイムに変化させることができます。
Cubism Editor上で設定した乗算色・スクリーン色はCubism 4.2以降のCubism Native Frameworkを利用することで、特に追加のコーディングをすることなく適用されます。
Cubism Editor上での乗算色・スクリーン色の設定はEditorマニュアルの「乗算色・スクリーン色」を参照してください。
また必要に応じたコーディングを行うことでSDKから乗算色・スクリーン色を操作し、以下のような動作も可能になります。

• インタラクティブに乗算色・スクリーン色を適用する
• Cubism Editor上で設定していない乗算色・スクリーン色を適用する
• Cubism Editor上で設定した乗算色・スクリーン色を無効にする

以降はその手順の説明になります。

処理手順

以下の流れで処理を行います。

• 乗算色・スクリーン色の上書きフラグ設定
• 乗算色・スクリーン色の設定
• モデルの描画

乗算色・スクリーン色の上書きフラグ設定

まずは乗算色・スクリーン色の上書きフラグを true に設定します。デフォルトでは false になっています。

model->GetModel()->SetOverwriteFlagForMultiplyColors(true); // 乗算色の上書きフラグ
model->GetModel()->SetOverwriteFlagForScreenColors(true); // スクリーン色の上書きフラグ

void SetOverwriteFlagForMultiplyColors(csmBool value) 及び void SetOverwriteFlagForScreenColors(csmBool value) はFrameworkの CubismModel クラスに定義されています。
Cubism SDK for Nativeのサンプルプロジェクトではモデルを操作するために CubismModel を基底クラスとした LAppModel クラスを定義しており、上記コードの model は LAppModel クラスです。
LAppModel クラスから CubismModel クラスの関数を呼び出すために GetModel() を仲介しています。

乗算色・スクリーン色の設定

乗算色・スクリーン色を定義し、モデルに設定します。
下記のコードでは全てのDrawableに対し、乗算色に赤、スクリーン色に緑を設定する場合の設定値です。
設定色はRGBAが使用できます。

for (Csm::csmUint32 i = 0; i < model->GetModel()->GetDrawableCount(); i++)
{
  Csm::Rendering::CubismRenderer::CubismTextureColor multiplyColor; // 乗算色
  multiplyColor.R = 1.0f;
  multiplyColor.G = 0.5f;
  multiplyColor.B = 0.5f;
  multiplyColor.A = 1.0f;
  Csm::Rendering::CubismRenderer::CubismTextureColor screenColor; // スクリーン色
  screenColor.R = 0.0f;
  screenColor.G = 0.5f;
  screenColor.B = 0.0f;
  screenColor.A = 1.0f;
  model->GetModel()->SetMultiplyColor(i, multiplyColor);
  model->GetModel()->SetScreenColor(i, screenColor);
}

乗算色・スクリーン色適用前

乗算色に赤、スクリーン色に緑を適用後

まずモデルのDrawableCountでループ処理している箇所ですが、乗算色・スクリーン色の処理は毎フレームに全てのDrawableで行われます。

Csm::Rendering::CubismRenderer::CubismTextureColor multiplyColor; // 乗算色
multiplyColor.R = 1.0f;
multiplyColor.G = 1.0f;
multiplyColor.B = 1.0f;
multiplyColor.A = 1.0f;
Csm::Rendering::CubismRenderer::CubismTextureColor screenColor; // スクリーン色
screenColor.R = 0.0f;
screenColor.G = 0.0f;
screenColor.B = 0.0f;
screenColor.A = 1.0f;

モデルの描画

model->Draw(projection);

Cubism SDK for Nativeのサンプルプロジェクトでもともと行っているモデルの Draw() 関数を呼び出すことで、Cubism Native Framework内部のレンダリング処理により乗算色・スクリーン色を含んだモデルが描画されます。

その他の関連関数

乗算色・スクリーン色の上書きフラグ取得

 true はSDKで設定した色情報を優先、 false はモデルの色情報を優先となります。

csmBool GetOverwriteFlagForMultiplyColors() const; // 乗算色上書きフラグの取得
csmBool GetOverwriteFlagForScreenColors() const; // スクリーン色上書きフラグの取得

乗算色・スクリーン色の設定

上記では Rendering::CubismRenderer::CubismTextureColor を引数にした設定方法を記載しましたが、RGBAを直接設定できる関数もあります。(入力値0.0~1.0）

void SetMultiplyColor(csmInt32 index, csmFloat32 r, csmFloat32 g, csmFloat32 b, csmFloat32 a = 1.0f); // 乗算色設定
void SetScreenColor(csmInt32 index, csmFloat32 r, csmFloat32 g, csmFloat32 b, csmFloat32 a = 1.0f); // スクリーン色設定

乗算色・スクリーン色の取得

各Drawableの乗算色・スクリーン色をCubismTextureColor型で取得します。

Rendering::CubismRenderer::CubismTextureColor GetMultiplyColor(csmInt32 index) const;
Rendering::CubismRenderer::CubismTextureColor GetScreenColor(csmInt32 index) const;

引数の index はDrawableのインデックスになります。

Cubism Native Frameworkの内部処理

乗算色・スクリーン色を表現するためのFrameworkの内部処理です。
以下の流れで処理を行います。

• Cubism Coreからモデルの乗算色・スクリーン色を取得
• 取得した乗算色・スクリーン色を上書きフラグで判別する
• 取得した乗算色・スクリーン色をシェーダプログラムに設定する
• フラグメントシェーダにてテクスチャカラー計算時に乗算色・スクリーン色を加える

Cubism Coreからモデルの乗算色・スクリーン色を取得

Cubism CoreのAPIを用いてモデルから乗算色・スクリーン色を全Drawable分取得します。

Core::csmVector4 CubismModel::GetDrawableMultiplyColor(csmInt32 drawableIndex) const
{
    const Core::csmVector4* multiplyColors = Core::csmGetDrawableMultiplyColors(_model);
    return multiplyColors[drawableIndex];
}

Core::csmVector4 CubismModel::GetDrawableScreenColor(csmInt32 drawableIndex) const
{
    const Core::csmVector4* screenColors = Core::csmGetDrawableScreenColors(_model);
    return screenColors[drawableIndex];
}

CoreのAPIは以下になります。

csmApi const csmVector4* csmCallingConvention csmGetDrawableMultiplyColors(const csmModel* model); // 乗算色取得
csmApi const csmVector4* csmCallingConvention csmGetDrawableScreenColors(const csmModel* model); // スクリーン色取得

CubismModelクラスの初期化時に全Drawable分全て取得し、メンバー配列に保持します。
SDK側で乗算色・スクリーン色を設定する場合は SetOverwriteFlagForMultiplyColors() 及び SetOverwriteFlagForScreenColors() にtrueを設定した上で、 SetMultiplyColor() 及び SetScreenColor() でメンバー配列を上書きします。