在运行时更改材质属性

您也可以在运行时更改在编辑器中找到的任何材质属性。这可能是切换纹理用于翻页书、为突出显示对象以指示交互性，或只是基于天气动画化高光。

在 Wonderland Engine 中，您可以通过Object3D.getComponent来获取网格组件使用的材质，或者在您的自定义组件中指定一个类型为Property.material()的参数。

更改材质属性

更改材质属性是通过Material类型上的生成的setter/getter完成的。

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

任何可以从材质属性面板中设置的属性，都可以在这里设置。

示例：淡入组件

下面的示例根据时间对材质的 alpha 值进行动画处理。这可以用作对象的淡入效果。

注意，使用网格组件上设置的材质的每个对象都将受到动画的影响。为了使动画对对象唯一，组件使用Material.clone来获取唯一实例并将其设置到网格。

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

export class FadeIn extends Component {
    static TypeName = 'fade-in';
    static Properties = {
        /* 淡入持续时间（秒） */
        duration: Property.float(2.0),
        /* 起始 alpha 值 */
        startAlpha: Property.float(2.0),
        /* 最终 alpha 值 */
        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;

        /* 设置漫反射颜色的 alpha。对于其他材质，您可能需要修改
         * 不同的属性 */
        const c = this.material.getDiffuseColor();
        this.material.setDiffuseColor([c[0], c[1], c[2], this.alpha]);
    }
}

请注意，像diffuseColor这样的材质属性取决于使用的流水线和着色器。例如，您可能希望为“Flat Opaque”而修改flatColor，或者为自定义着色器完全不同的属性。

材质属性面板中显示的任何属性都可以通过这种方式编辑。