Attention: Here be dragons

This is the latest (unstable) version of this documentation, which may document features not available in or compatible with released stable versions of Godot.

Використання VisualShaders

VisualShaders — це візуальна альтернатива для створення шейдерів.

Оскільки шейдери за своєю суттю пов’язані з візуальними елементами, підхід на основі графіків із попереднім переглядом текстур, матеріалів тощо пропонує багато додаткових зручностей порівняно з шейдерами, заснованими виключно на сценаріях. З іншого боку, VisualShaders не розкривають усі функції сценарію шейдера, і використання обох паралельно може знадобитися для певних ефектів.

Примітка

Якщо ви не знайомі з шейдерами, почніть із прочитання Знайомство з шейдерами.

Створення VisualShader

VisualShaders можна створити в будь-якому class_ShaderMaterial. Щоб почати використовувати VisualShaders, створіть новий ShaderMaterial в об’єкті за вашим вибором.

../../_images/shader_material_create_mesh.webp

Потім призначте ресурс class_Shader властивості Shader.

../../_images/visual_shader_create.webp

Натисніть новий ресурс Shader, і діалогове вікно Create Shader відкриється автоматично. Змініть параметр «Тип» на class_VisualShader у спадному списку, а потім дайте йому назву.

../../_images/visual_shader_create2.webp

Клацніть на щойно створеному візуальному шейдері, щоб відкрити редактор шейдерів. Макет редактора шейдерів складається з чотирьох частин: списку файлів ліворуч, верхньої панелі інструментів, самого графіка та попереднього перегляду матеріалу праворуч, який можна вимкнути

../../_images/visual_shader_editor2.webp

Зліва направо на панелі інструментів:

  • Стрілку можна використовувати для перемикання видимості панелі файлів.

  • Кнопка File відкриває випадаюче меню для збереження, завантаження та створення файлів.

  • Кнопка Add Node відображає спливаюче меню, яке дозволяє додавати вузли до графіка шейдерів.

  • У спадному меню є тип шейдера: Вершина, Фрагмент і Світло. Як і для шейдерів сценаріїв, він визначає, які вбудовані вузли будуть доступні.

  • Наступні кнопки та введення цифр керують рівнем масштабування, прив’язкою сітки та відстанню між лініями сітки (у пікселях).

  • Перемикач визначає, чи буде мінікарта графіка у нижній правій частині редактора видима чи ні.

  • Кнопка автоматичного впорядкування вибраних вузлів намагатиметься впорядкувати будь-які вибрані вузли якомога ефективніше та чистіше.

  • Кнопка «Керувати варіаціями» відкриває спадне меню, за допомогою якого можна додати або видалити варіацію.

  • Кнопка «Показати згенерований код» показує код шейдера, який відповідає вашому графіку.

  • Перемикач вмикає або вимикає попередній перегляд матеріалу.

  • Кнопка Online Docs відкриває цю сторінку документації у вашому веббраузері.

  • Остання кнопка дозволяє розмістити редактор шейдерів в окремому вікні, окремо від решти редактора.

Примітка

Хоча VisualShaders не потребують кодування, вони мають ту саму логіку, що й скриптові шейдери. Рекомендується вивчити основи обох, щоб добре розуміти конвеєр затінення.

Графік візуального шейдера перетворюється на шейдер сценарію за сценою, і ви можете побачити цей код, натиснувши останню кнопку на панелі інструментів. Це може бути зручно, щоб зрозуміти, що робить даний вузол і як відтворити це в сценаріях.

Використання редактора візуальних шейдерів

За замовчуванням кожен новий VisualShader матиме вихідний вузол. Кожне підключення вузла закінчується в одному з розеток вихідного вузла. Вузол — це основна одиниця для створення вашого шейдера. Щоб додати новий вузол, натисніть кнопку Додати вузол у верхньому лівому куті або клацніть правою кнопкою миші будь-яке порожнє місце на графіку, і з’явиться спливаюче меню.

../../_images/vs_popup.webp

Це спливаюче вікно має такі властивості:

  • Якщо ви клацнете правою кнопкою миші на графіку, це меню буде викликано в позиції курсора, і створений вузол у цьому випадку також буде розміщено під цією позицією; інакше він буде створений у центрі графіка.

  • Його розміри можна змінювати по горизонталі та вертикалі, щоб відображати більше вмісту. Перетворення розміру та позиція вмісту дерева зберігаються між викликами, тому, якщо ви раптово закрили спливаюче вікно, ви можете легко відновити його попередній стан.

  • Параметри Розгорнути все і Згорнути все у спадному меню параметрів можна використовувати для легкого переліку доступних вузлів.

  • Ви також можете перетягувати вузли зі спливаючого вікна на графік.

Хоча спливаюче вікно має вузли, відсортовані за категоріями, спочатку це може здатися приголомшливим. Спробуйте додати кілька вузлів, підключіть їх до вихідного роз’єму та спостерігайте, що відбувається.

Під час підключення будь-якого виходу scalar до входу vector, усі компоненти вектора візьмуть значення скаляра.

При підключенні будь-якого виходу вектора до входу скаляра, значення скаляра буде середнім компонентів вектора.

Інтерфейс вузла Visual Shader

Вузли візуального шейдера мають вхідні та вихідні порти. Вхідні порти розташовані з лівого боку вузла, а вихідні – з правого боку вузла.

../../_images/vs_node.webp

Ці порти пофарбовані, щоб відрізнити тип порту:

Типи даних

Тип

Колір

Опис

Приклад

Скалярний

Сірий

Скаляр – це одне значення.

скалярний

Вектор

Фіолетовий

Вектор – це набір значень.

Вектор

Логічний

Зелений

Увімкнено чи вимкнено, правда чи хибність.

логічний

Перетворення

Рожевий

Матриця, яка зазвичай використовується для перетворення вершин.

перетворення

Пробник

Помаранчевий

Зразок текстури. Його можна використовувати для зразків текстур.

просто

Усі типи використовуються в обчисленнях вершин, фрагментів і світла в шейдері. Наприклад: множення матриць, додавання векторів або скалярне ділення.

Є й інші типи, але це основні.

Вузли Visual Shader

Нижче наведено деякі особливі вузли, про які варто знати. Список не є вичерпним і може бути розширений іншими вузлами та прикладами.

Вузол експресії

Вузол Expression дозволяє вам писати вирази Godot Shading Language (GLSL-подібні) у ваших візуальних шейдерах. Вузол має кнопки для додавання будь-якої кількості необхідних вхідних і вихідних портів і може змінювати розмір. Ви також можете встановити назву та тип кожного порту. Вираз, який ви ввели, буде негайно застосовано до матеріалу (щойно фокус залишить текстове поле виразу). Будь-які помилки аналізу або компіляції буде надруковано на вкладці Вивід. Ґ За замовчуванням виходи ініціалізуються нульовим значенням. Вузол розташований на вкладці «Спеціальний» і може використовуватися в усіх режимах шейдера.

Можливості цього вузла майже безмежні – ви можете писати складні процедури та використовувати всю потужність текстових шейдерів, таких як цикли, ключове слово discard, розширені типи тощо. Наприклад:

../../_images/vs_expression2.png

Вузол перенаправлення

Вузол Reroute використовується суто в організаційних цілях. У складному шейдері з багатьма вузлами ви можете виявити, що шляхи між вузлами ускладнюють читання. Reroute, як випливає з назви, дозволяє регулювати шлях між вузлами, щоб полегшити читання. Ви навіть можете мати кілька вузлів зміни маршруту для одного шляху, який можна використовувати для створення прямих кутів.

../../_images/vs_reroute.webp

Щоб перемістити вузол зміни маршруту, перемістіть курсор миші над ним і візьміть маркер, який з’явиться.

../../_images/vs_reroute_handle.webp

Вузол Френеля

Вузол Френеля призначений для прийому нормалей і векторів перегляду та створює скаляр, який є насиченим скалярним добутком між ними. Крім того, ви можете налаштувати інверсію та ступінь рівняння. Вузол Френеля чудово підходить для додавання ефекту освітлення, подібного до обідка, до об’єктів.

../../_images/vs_fresnel.webp

Логічний вузол

Вузол Boolean можна перетворити на Scalar або Vector для представлення 0 або 1 та (0, 0, 0) або (1, 1, 1) відповідно. Цю властивість можна використовувати для ввімкнення або вимкнення деяких частин ефекту одним клацанням миші.

../../_images/vs_boolean.gif

Якщо вузол

Вузол If дозволяє налаштувати вектор, який повертатиме результат порівняння між a та b. Можна повернути три вектори: a == b (у цьому випадку параметр допуску надається як поріг порівняння – за замовчуванням він дорівнює мінімальному значенню, тобто 0,00001), a > b та a < b.

../../_images/vs_if.png

Вузол комутатора

Вузол Switch повертає вектор, якщо логічна умова true або false. Boolean було представлено вище. Якщо ви хочете перетворити вектор на справжній логічний, усі компоненти вектора мають бути відмінними від нуля.

../../_images/vs_switch.webp

Сітчастий випромінювач

Вузол Mesh Emitter використовується для випромінювання частинок з вершин сітки. Це доступно лише для шейдерів, які перебувають у режимі Particles.

Майте на увазі, що не всі 3D-об'єкти є файлами сітки. Файл glTF не можна перетягнути на графік. Однак, ви можете створити з нього успадковану сцену, зберегти сітку в цій сцені як окремий файл і використовувати її.

../../_images/vs_meshemitter.webp

Ви також можете перетягнути файли obj у редактор графіків, щоб додати вузол для конкретної сітки, інші файли сітки для цього не працюватимуть.