実行時のマテリアルプロパティの変更

エディター上で見つけたマテリアルプロパティは、実行時においても変更可能です。例えば、フリップブック用にテクスチャを切り替えたり、相互作用を示すためにオブジェクトをハイライトしたり、天候に基づいてスペキュラリティを単にアニメーション化することができます。

Wonderland Engineでは、Object3D.getComponent を使ってコンポーネントを取得するか、Property.material() 型のパラメーターをカスタムコンポーネントに指定することでメッシュコンポーネントが使用するマテリアルを取得できます。

マテリアルプロパティの変更

マテリアルプロパティの変更は、Material タイプの生成されたセッター/ゲッターを介して行います。

material.setDiffuseColor([1, 1, 0, 1]); /* R, G, B, A */
material.setSpecularity(2);
material.setDiffuseTexture(someTexture);

マテリアルプロパティパネルから設定可能なプロパティは、ここで設定できます。

例: フェードコンポーネント

以下の例では、時間に基づいてマテリアルのアルファ値をアニメートします。これは、オブジェクトのフェードイン効果として使用できます。

メッシュコンポーネントに設定されたマテリアルを使用するすべてのオブジェクトがアニメーションの影響を受けることに注意してください。アニメーションをオブジェクトに固有のものにするために、コンポーネントは Material.clone を使用してユニークなインスタンスを取得し、それをメッシュに設定しています。

import {Component, Property} from '@wonderlandengine/api';

export class FadeIn extends Component {
    static TypeName = 'fade-in';
    static Properties = {
        /* フェードの持続時間（秒） */
        duration: Property.float(2.0),
        /* 開始アルファ値 */
        startAlpha: Property.float(2.0),
        /* 最終アルファ値 */
        endAlpha: Property.float(2.0),
    };

    start() {
        /* このオブジェクトにアタッチされたメッシュコンポーネントからマテリアルを取得 */
        const mesh = this.object.getComponent('mesh');
        if (!mesh) throw new Error('オブジェクトにメッシュコンポーネントがありません。');
        /* 同じマテリアルを使用している他のオブジェクトを誤って変更しないように */
        this.material = mesh.material.clone();
        mesh.material = this.material;
    }

    onActivate() {
        this.alpha = 1.0;
        this.time = 0;
    }

    update(dt) {
        this.time += dt;

        this.alpha =
            this.startAlpha +
            (this.endAlpha - this.startAlpha) * Math.min(1.0, this.time / this.duration);
        /* endAlpha に達した後は update() を呼び出す必要はありません */
        if (this.alpha == this.endAlpha) this.active = false;

        /* ディフューズカラーのアルファを設定します。他のマテリアルの場合、異なるプロパティを変更する必要があるかもしれません */
        const c = this.material.getDiffuseColor();
        this.material.setDiffuseColor([c[0], c[1], c[2], this.alpha]);
    }
}

ここでの diffuseColor のように、マテリアルプロパティは使用するパイプラインとシェーダに依存しています。「フラット不透明」用には flatColor を修正したり、カスタムシェーダの場合は完全に異なる何かを変更する必要があるかもしれません。

マテリアルのプロパティパネルに表示されている任意のプロパティは、この方法で編集可能です。