Изменение свойств материала во время выполнения

Вы можете изменять любые свойства материала, которые вы можете найти в редакторе, также и во время выполнения. Это может быть смена текстуры для анимации flipbook, выделение объекта для указания на его интерактивность или просто анимация отражательной способности в зависимости от погодных условий.

В 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);
        /* Нет необходимости вызывать update(), если достигнуто endAlpha */
        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 для “Flat Opaque” или что-то совсем другое для пользовательских шейдеров.

Любое свойство, отображаемое в панели свойств материала, для материала может быть изменено таким образом.