Как сделать прозрачный материал ue4

UEngine.Ru

Русскоязычное сообщество Unreal Engine 4

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Свойства материалов

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

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

Не все свойства обязательно применять и вносить в них изменения, так как они имеют значения по умолчанию. Например, когда вы создаете светящийся материал, вам может понадобится только Emissive Color, так как другие свойства не будут иметь значения или будут недоступны, в зависимости от Shading Model параметра. Из-за этого важно понимать, как должен выглядеть ваш материал в итоге. Всего существует три самых важных параметра:

Blend Mode — Определяет, как материал смешивается с пикселями позади.
Shading Model — Определяет, как поверхность материала влияет на свет.
Material Domain — Определяет, как будет использоваться материал.

Редактор материалов автоматически отключает неиспользуемые свойства в зависимости от параметров.

Подробнее о параметрах материалов.

Картинки сбоку кликабельны

Base Color

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Base Color определяет цвет материала.

Metallic

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Данное свойство определяет, насколько материал металезированный. Неметалические материалы должны иметь Metallic на нуле, в то время как металические — на еденицу. Для чистых поверхностей, рекомендуется использовать значение 0 ИЛИ 1. Для грязных, ржавых и т.п поверхностей возможно потребуется использовать значение между 0 и 1.

Specular

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Данное свойство влияет на то, насколько блестящий неметаллический материал. На металлический материал данное свойство влиять никак не будет.

На практике, данное свойство должно оставаться без изменений(по умолчанию — 0.5) в большинстве случаях.

Roughness

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Шерховатость материала. При увелечении данного свойства, материал будет сильнее рассеивать свет. Благодаря чему, нулевое значение будет означать полностью гладкий и отражающий материал, а значение 1 будет полностью рассеивать свет.

Emissive Color

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Определяет, какая часть(при использовании маски) материала будет светится.

Значения больше 1 позволят создать HDR эффект и эффект свечения.

Opacity

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Данное свойство определяет прозрачность материала и доступно только при Translucent Blend Mode.

0 — Полностью прозрачный
1 — Полностью видимый

Opacity Mask

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Аналогично Opacity, однако используется с Masked Blend Mode. Так же отличается от Opacity тем, что имеет лишь два состояния: Полностью прозрачный или полностью видимый.

Можете использовать Opacity Mask Clip Value для того, что бы отрезать маску для использования с данным свойством.

Normal

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Данное свойство использует карту нормалей, которая служит для того, что бы создать рельеф(Эффект, не реальное выдавливание) для поверхности.

World Position Offset

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Данное свойство позволяет манипулировать вертексами объекта с помощью материала. Это полезно для того, что бы менять форму статичного объекта.

При использовании WPO для того, что бы изменить границы объекта, учтите, что рендер все равно будет использовать оригинальную геометрию, поэтому могут быть артефакты в тенях.

World Displacement и Tessellation Multiplier

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

World Displacement работает примерно как и WPO, однако использует тесселляцию вместо обычных вертексов(как WPO). Для использования данного свойства, опция Tessellation должна быть включена в параметрах материала.

Tessellation Multiplier определяет силу тесселляции и используется для того, что бы добавить делатей там, где нужно. При использовании с World Displacement значение нужно выставить больше нуля.

При использовании World Displacement для того, что бы изменить границы объекта, учтите, что рендер все равно будет использовать оригинальную геометрию, поэтому могут быть артефакты в тенях.

Subsurface Color

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Определяет цвет света, который проходит свозь поверхность. Например для материала людской кожи, цвет Subsurface должен быть красным, что бы симулировать влияние крови на свет, проходящий сквось поверхность.

Данное свойство доступно только при Translucent Blend Mode.

Ambient Occlusion

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Данное свойство отвечает за само-затенение, которое часто зависит от неровности объекта или рельефа поверхности. Обычно соеденяется с АО картой, которая генеруется сторонней программой(пр: 3Ds Max или Zbrush).

Refraction

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Свойство, отвечающее за приломляемость поверхности. Полезно для таких поверхностей, как стекло или вода, которые приломляют свет, проходящий свозь материал.

Коэффиценты приломления для некоторых материалов:
Воздух — 1.00
Вода — 1.33
Лед — 1.31
Стекло — 1.52
Алмаз — 2.42

Clear Coat

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Данный эффект хорошо симулирует двуслойный материал, который имеет прозрачный слой поверх. Например деревянная поверхность покрытая стеклянной плитой для гладгости. Используется с Clear Coat Shading Model параметром.

Данная модель имеет два свойства:

Clear Coat: сила эффекта. 0 — обычный материал, 1 — Материал м Clear Coat слоем. Полезно для использования маски.

Clear Coat Roughness: Шерховитость Clear Coat слоя.

Источник

Как сделать в ue4 маску частичной прозрачности

Имеется балкон, который должен быть одним неразъёмным мешем, у которого текстурой хочу определить полностью непрозрачные (железо, бетон) и частично прозрачные (стёкла) элементы.

oduvan
так сделай не одним мешем. Откуда подобные условия рождаются? Зачем рисовать непрозрачные элементы тоже прозрачными, но непрозрачным при этом?)) рисуй бетон и железо одним материалом, стекла другим. Пасаны так делают. Так правильно.

bool
> так сделай не одним мешем
Так мне не подходит по разным причинам, в том числе и потому что из-за частого переплёта у меня появится как минимум 18 лишних полигонов на балкон, чего мне хотелось бы избежать.

A Blend Mode в Translucent или в Masked установлен? Для полупрозрачности нужен Translucent.
Если все нормально, тогда в альфе полупрозрачные элементы должны быть соответственно серыми. Или можно оставить белыми, и регулировать прозрачность таким простым способом:

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4
Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Adel0n
Спасибо, помогло! Быстрый тест дал такую картинку:

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Если стоит Two Sided, возможно, в этом проблема.

oduvan
Проблема в том что для рисования полупрозрачных объектов их нужно сортировать. И вот твой пол неверно сортируется то в ту, то в другую сторону.

По моему рано или поздно с этой проблемой все сталкиваются (ну кто работает с риалтайм графикой). Уже много лет на автомате всегда разделяю объекты в таких ситуациях, не думаю что что-то новое придумано.

В общем судя по опытам, проблема возникает при любом наложении полупрозрачных transluent объектов на другие аналогичные объекты. С другими типами материалов вроде бы проблемы такой нет.

Источник

Туториал по Unreal Engine. Часть 3: материалы

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Как и в реальном мире, в играх есть множество объектов, каждый со своим внешним видом. В Unreal Engine этот внешний вид зависит от материалов. Какой цвет имеет объект? Прозрачен ли он? Блестит ли? Все эти свойства задаются материалами.

Материалы используются почти для любого визуального элемента в Unreal Engine. Материалы можно наносить на любые объекты, включая меши, частицы и элементы UI.

В этой части туториала вы научитесь следующему:

Примечание: эта статья является одной из восьми частей туториала по Unreal Engine:

Приступаем к работе

Скачайте заготовку проекта и распакуйте её. Чтобы открыть проект, перейдите в папку проекта и откройте BananaCollector.uproject.

Примечание: если откроется окно, сообщающее, что проект создан в более ранней версии Unreal editor, то всё в порядке (движок часто обновляется). Можно или выбрать опцию создания копии, или опцию преобразования самого проекта.

Вы увидите небольшую область, в которой расположены бананы. Нажмите Play, чтобы управлять красным кубом с помощюь клавиш W, A, S и D. Собирать бананы можно, касаясь их.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Для начала давайте изменим материал банана, чтобы менять его яркость. Перейдите в папку Materials и дважды нажмите на M_Banana, чтобы открыть его в редакторе материалов.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Чтобы отрегулировать яркость банана, нам нужно управлять его текстурой.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Управление текстурами

По своей сущности текстура является изображением, а изображение — это набор пикселей. В цветном изображении цвет пикселя определяется его красным ®, зелёным (G) и синим (B) каналами.

Ниже представлен пример изображения 2×2 с указанными для каждого пикселя значениями RGB.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Примечание: в Unreal Engine каналы RGB имеют интервал значений от 0.0 до 1.0. Однако в большинстве других приложений каналы RGB имеют интервал от 0 до 255. Это просто разные способы отображения одинаковой информации и они не означают, что интервал цветов Unreal Engine меньше.

Управление текстурой осуществляется выполнением операций над каждым пикселем текстуры. Операции могут быть даже простыми, например, добавлением значения к каналам.

Ниже представлен пример ограничения каждого канала в интервале от 0.4 до 1.0. Благодаря этому увеличивается минимальное значение каждого канала, что делает каждый цвет ярче.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Вот как это можно сделать в редакторе материалов:

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Теперь можно использовать нод Multiply для регулировки яркости текстуры.

Нод Multiply

Нод Multiply делает именно то, что следует из его названия: он умножает один вход на другой вход.

С помощью умножения можно изменять яркость пикселя, не затрагивая его оттенок или насыщенность. Ниже представлен пример уменьшения яркости наполовину умножением каждого канала на 0.5.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

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

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Мы не будем рассматривать это в туториале, но вы можете использовать нод Multiply в сочетании с текстурой-маской. С помощью маски можно указать, какие области базовой текстуры должны быть темнее. Вот пример наложения маски из текстуры плитки на текстуру камня:

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Наложение маски работает, потому что градации серого представляют собой интервал от 0 (чёрный) до 1 (белый).

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Белые области имеют полную яркость, потому что каналы умножены на 1. Серые области темнее, потому что каналы умножаются на значения меньше 1. Чёрные области не имеют яркости, потому что каналы умножены на 0.

Теперь настало время воспользоваться нодом Multiply.

Регулировка яркости текстур

Разорвите связь между нодом Texture Sample и контактом Base Color. Это можно сделать, нажав правой клавишей мыши на любой контакт и выбрав Break Link(s). Или же можно удерживать клавишу Alt и нажать левой клавишей мыши на соединяющей линии.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Создайте нод Multiply и Constant. Их можно создать быстро, удерживая клавишу M (для нода Multiply) или клавишу 1 (для нода Constant) и левой клавишей мыши на пустом пространстве в графе. После этого соединение должно выглядеть следующим образом:

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Такая схема будет итеративно обходить каждый пиксель и умножать каждый канал на значение нода Constant. Наконец, получившаяся текстура будет выведена как Base Color.

Пока получившаяся текстура будет чёрной, потому что множитель равен нулю. Для изменения значения множителя выберите нод Constant и перейдите в панель Details. Введите в поле Value значение 5.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Нажмите Apply и вернитесь к основному редактору. Вы увидите, что бананы теперь стали намного ярче.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Давайте разнообразим сцену, добавив бананы разного цвета. Конечно, можно создавать новый материал для каждого цвета, но проще создать экземпляр материала.

Об экземплярах материалов

Экземпляр материала — это копия материала. Все изменения, вносимые в базовый материал, отображаются также и на экземпляре материала.

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

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Для простых материалов этот процесс занимает всего несколько секунд. Однако для сложных материалов время компиляции может быть значительно больше.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Экземпляры материалов удобно применять в следующих случаях:

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Прежде чем создать экземпляр, нам нужно создать параметры в базовом материале. Они будут отображаться в экземпляре материала и позволят настраивать свойства материала.

Создание параметров материалов

Вернитесь в редактор материалов и выберите материал M_Banana.

Во-первых, нам нужен нод, меняющий оттенок текстуры. Для этого можно использовать нод HueShift. Добавьте его в граф и соедините следующим образом:

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Теперь нам нужно создать нод Scalar Parameter. В этом ноде хранится единственное значение и его можно будет изменять в экземпляре материала. Этот нод можно быстро создать, удерживая клавишу S и нажав левой клавишей мыши на пустом пространстве в графе. После создания нода соедините его с контактом Hue Shift Percentage (S) нода HueShift.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Неплохо также будет давать названия параметрам. Выберите нод Scalar Parameter и перейдите в панель Details. Измените Parameter Name на HueShiftPercentage.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Можно также преобразовать ноды Constant в Scalar Parameter. Нажмите правой клавишей мыши на добавленный ранее нод Constant, а затем выберите Convert to Parameter. Переименуйте параметр в Brightness.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Теперь мы создадим экземпляр материала.

Создание экземпляра материала

Перейдите в Content Browser и выберите папку Materials. Нажмите правой клавишей мыши на M_Banana и выберите Create Material Instance. Переименуйте новый ассет в MI_Banana_Green.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Дважды нажмите на MI_Banana_Green, чтобы открыть его. При этом он откроется в редакторе экземпляров материалов.

Редактор экземпляров материалов состоит из трёх панелей:

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Теперь мы изменим параметры, чтобы сменить цвет банана на зелёный. Чтобы сделать параметры редактируемыми, нажмите левой клавишей мыши на флажок рядом с каждым параметром.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Укажите для Brightness значение 0.5, а для HueShiftPercentage — значение 0.2. В результате у вас получится следующее:

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Мы создали экземпляр материала, теперь можно применить его на некоторые из бананов! Закройте экземпляр материала и перейдите во Viewport основного редактора.

Применение экземпляра материала

Располагаемые в сцене акторы можно редактировать индивидуально. Это значит, что если вы измените материал для одного банана, то это не повлияет на остальные. Можно воспользоваться этим, чтобы изменить цвет некоторых бананов на зелёный.

Выберите любой банан и перейдите в панель Details. В списке компонентов выберите компонент StaticMesh.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

В панели Details отобразятся свойства компонента StaticMesh. Измените материал на MI_Banana_Green.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Повторите процесс ещё несколько раз для лучшего распределения жёлтых и зелёных бананов. Попробуйте создать ещё один экземпляр материала, чтобы у вас были и фиолетовые бананы!

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Динамически изменяемые материалы

Материалы не обязательно должны быть только косметическими: можно использовать их и для помощи в геймдизайне. Сейчас мы разберёмся, как динамически изменять цвет куба с белого до красного, когда игрок собирает бананы.

Прежде чем создавать экземпляр материала, нужно будет настроить материал куба.

Убедитесь, что находитесь в папке Materials и дважды щёлкните на M_Cube, чтобы открыть его.

Во-первых, нам нужен способ создания цветов. К ноду Base Color подсоединён нод Constant3Vector. Эти ноды идеально подходят для выбора цветов, потому что у них есть красный, зелёный и синий каналы.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Поскольку красный цвет уже был создан, мы создадим белый цвет. Добавьте ещё один нод Constant3Vector. Это можно сделать быстро, удерживая клавишу 3 и нажав левой клавишей мыши на пустом пространстве в графе.

Откройте инструмент выбора цвета, дважды щёлкнув на нод Constant3Vector.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Выберите белый цвет, или с помощью ползунков, или введя значение 1.0 для каналов R, G и B. Затем нажмите кнопку OK.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Чтобы изменить цвет с белого на красный, нам нужен способ создания плавного перехода между ними. Есть простой способ его реализации — линейная интерполяция.

Что такое «линейная интерполяция»?

Линейная интерполяция — это способ нахождения значений между A и B. Например, можно использовать линейную интерполяцию для нахождения значения посередине между 100 и 200.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Линейная интерполяция становится ещё более мощным инструментом, если можно управлять alpha. Мы можем воспринимать alpha как процент между A и B. Alpha = 0 вернёт значение A, а alpha = 1 — значение B.

Например, можно увеличивать alpha постепенно, чтобы плавно перемещать объект из точки A в точку B.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

В этом туториале мы будем управлять alpha с помощью количества собранных бананов.

Использование нода LinearInterpolate

Во-первых, добавим нод LinearInterpolate. Это можно сделать быстро, удерживая клавишу L и нажав левой клавишей мыши на пустом пространстве в графе.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Затем создадим нод Scalar Parameter и назовём его ColorAlpha. Соединим ноды следующим образом (заметьте, что белый теперь находится сверху):

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Подведём итог: нод LinearInterpolate будет выводить значение входного значения A. Так происходит потому, что начальное значение alpha равно 0. При приближении alpha к 1, выходное значение будет приближаться ко входному значению B.

Материал уже готов. Нам ещё предстоит многое сделать, но чтобы посмотреть, что у нас получилось, нажмите на Apply и закройте редактор материалов. Если нажать Play, то вы увидите, что теперь куб не красный, а белый.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Чтобы куб менял цвет, необходимо изменять параметр ColorAlpha. Однако существует одна проблема. Во время выполнения игры мы не можем изменять параметры экземпляра материала. Решением будет использование динамических экземпляров материалов.

О динамических экземплярах материалов

В отличие от обычного экземпляра, динамический экземпляр материала можно изменять во время игрового процесса. Это можно делать с помощью Blueprints или C++.

Динамические материалы можно использовать различными способами, например, изменять прозрачность объекта, чтобы делать его невидимым. Или менять блеск объекта, когда он становится мокрее.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Ещё один хороший аспект динамических экземпляров материалов заключается в том, что их можно изменять индивидуально.

Ниже представлен пример обновления отдельных экземпляров для наложения маски на области объекта.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Давайте начнём с создания динамического экземпляра материала.

Создание динамического экземпляра материала

Динамические экземпляры материалов можно создавать только во время процесса игры. Для этого можно использовать Blueprints (или C++).

В Content Browser перейдите в папку Blueprints и дважды щёлкните на BP_Player, чтобы открыть его.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Первое, что мы сделаем — это создадим новый динамический экземпляр материала и затем применим его к мешу куба. Логично будет делать это, когда Unreal спаунит актора, а эту задачу выполняет нод Event BeginPlay.

Перейдите в Event Graph и найдите нод Event BeginPlay.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Теперь добавьте нод Create Dynamic Material Instance (StaticMesh). Этот нод будет одновременно создавать и применять новый динамический экземпляр материала к мешу куба.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Теперь нам нужно указать, какой материал должен использовать куб. Нажмите на раскрывающийся список в Source Material и выберите M_Cube.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Чтобы удобнее ссылаться на материал, лучше всего хранить его в переменной. Проще всего это сделать нажав правой клавишей мыши на контакт Return Value нода Create Dynamic Material Instance. Затем выберите Promote to Variable.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Если заглянуть во вкладку My Blueprint, то вы заметите, что там появилась новая переменная. Переименуйте её в CubeMaterial. Это можно быстро сделать, нажав клавишу F2.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Наконец, соедините нод Event BeginPlay с нодом Create Dynamic Material Instance.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Подведём итог: когда Unreal спаунит BP_Player, он создаёт новый динамический экземпляр материала и применяет его к компоненту StaticMesh. Затем он сохраняет материал в переменную под названием CubeMaterial.

Следующим шагом будет создание счётчика для отслеживания количества собранных бананов.

Создание счётчика бананов

Если немного переместиться от нода Event BeginPlay, то можно увидеть следующую схему. Здесь мы будем обновлять счётчик бананов и материал.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Нод On Component Begin Overlap выполняется, когда куб перекрывает другого актора. Затем нод Cast to BP_Banana проверяет, является ли перекрываемый актор бананом. Если актор — это банан, то нод DestroyActor уничтожает его и он исчезает из игры.

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

Создайте новую переменную Float и назовите её BananaCounter. Перетащите переменную BananaCounter в Event Graph и выберите Get.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Далее присоедините нод DestroyActor к ноду IncrementFloat.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Теперь, когда игрок будет поднимать банан, переменная BananaCounter будет увеличиваться на единицу.

Если бы мы использовали BananaCounter в качестве alpha прямо сейчас, то получили бы неожиданные результаты, потому что нод LinearInterpolation ожидает значения в интервале от 0 до 1. Можно использовать нормализацию для преобразования счётчика в интервал от 0 до 1.

Для нормализации мы просто разделим BananaCounter на максимальное значение. Это значение равно количеству бананов, которое должен собрать куб, чтобы полностью стать красным.

Добавим нод float / float и соединим его верхний контакт с оставшимся контактом нода IncrementFloat.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Зададим в качестве нижнего входного значения нода float / float значение 6. Это значит, что куб станет полностью красным, когда игрок соберёт шесть бананов.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Но есть небольшая проблема. Когда игрок соберёт больше шести бананов, то alpha станет больше единицы. Чтобы исправить это, воспользуемся нодом Clamp (float) для ограничения alpha интервалом от 0 до 1.

Добавьте нод Clamp (float) и соедините контакт Value с правым контактом нода float / float.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Теперь, когда у нас есть alpha, настало время для передачи её значения материалу.

Обновление материала

Перетащите переменную CubeMaterial в Event Graph и выберите Get.

Затем перетащите контакт переменной CubeMaterial на пустое пространство и отпустите левую клавишу мыши. При этом появится список нодов, которые могут использовать переменную этого типа. Любой выбранный нод будет автоматически соединён с переменной. Добавьте нод Set Scalar Parameter Value. Этот нод будет задавать указанному параметру передаваемое значение.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Теперь нужно указать обновляемый параметр. Выберите в поле Parameter Name значение ColorAlpha. Это параметр, который мы создали в материале куба.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Соедините результат нода Clamp (float) с контактом Value нода Set Scalar Parameter Value.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Наконец, соедините нод IncrementFloat с нодом Set Scalar Parameter Value.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Порядок выполнения будет следующим:

Нажмите на Play и начните собирать бананы. Куб сначала будет белым и постепенно станет краснеть при собирании бананов. Когда вы соберёте шесть бананов, он станет полностью красным.

Как сделать прозрачный материал ue4. Смотреть фото Как сделать прозрачный материал ue4. Смотреть картинку Как сделать прозрачный материал ue4. Картинка про Как сделать прозрачный материал ue4. Фото Как сделать прозрачный материал ue4

Куда двигаться дальше?

Готовый проект можно скачать здесь.

Мне нравятся материалы, потому что это очень мощный инструмент, с помощью которого можно сделать многое. Можно соединять материалы, чтобы создавать сложные материалы наподобие камня с растущим в трещинах мхом. Также можно создавать интересные эффекты, например, показанный в туториале эффект дезинтеграции.

Если вы хотите больше узнать о материалах, то рекомендую прочитать страницу Material Inputs в документации Unreal Engine. Изучение возможностей входов позволит вам создавать более сложные материалы.

Советую поэкспериментировать с материалами и протестировать разные ноды (их там много). Лучший способ обучения — попробовать всё самому.

Если вы хотите продолжить изучение, прочитайте следующий пост в серии туториалов, в котором я расскажу о том, как добавлять в игры элементы UI, например, метки или кнопки.

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *