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.

2D світло і тінь

Вступ

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

Немає 2D світла чи тіні, сцена незатінена

Немає 2D світла чи тіні, сцена незатінена

Увімкнено 2D освітлення (без тіней)

Увімкнено 2D освітлення (без тіней)

Увімкнено 2D світло й тіні

Увімкнено 2D світло й тіні

Вузли

Є кілька вузлів, задіяних у повному налаштуванні двовимірного освітлення:

  • CanvasModulate (щоб затемнити решту сцени)

  • PointLight2D (для всенаправлених або точкових світильників)

  • DirectionalLight2D (для сонячного або місячного світла)

  • LightOccluder2D (для світлих тіней)

  • Інші 2D-вузли, які отримують освітлення, наприклад Sprite2D або TileMapLayer.

CanvasModulate використовується для затемнення сцени, вказуючи колір, який діятиме як базовий колір "оточення". Це остаточний колір освітлення в областях, які не охоплює жодне 2D світло. Без вузла CanvasModulate остаточна сцена виглядала б надто яскравою, оскільки двовимірне освітлення лише освітлювало б наявний незатінений вигляд (який виглядає повністю освітленим).

Sprite2Ds використовуються для відображення текстур для світлових плям, фону та тіней.

PointLight2Ds використовуються для освітлення сцени. Як правило, світло працює шляхом додавання вибраної текстури до решти сцени для імітації освітлення.

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

Тіні з’являються лише на ділянках, охоплених PointLight2D, і їх напрямок базується на центрі Світла.

Примітка

Колір фону не отримує освітлення. Якщо ви хочете, щоб світло падало на фон, вам потрібно додати візуальне представлення фону, наприклад Sprite2D.

Властивості Region Sprite2D можуть бути корисними для швидкого створення фонової текстури, що повторюється, але не забудьте також встановити Texture > Repeat на Enabled у властивостях Sprite2D.

Точкові світильники

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

PointLight2D пропонує такі властивості для налаштування в інспекторі:

  • Текстура: Текстура для використання як джерело світла. Розмір текстури визначає розмір світла. Текстура може мати альфа-канал, який корисний під час використання режиму змішування Light2D Mix, але він не потрібен, якщо використовується режим змішування Add (за замовчуванням) або Subtract.

  • Зсув: Зсув для світлої текстури. На відміну від переміщення світлового вузла, зміна зсуву не спричиняє переміщення тіней.

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

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

Якщо у вас немає попередньо створеної текстури для використання у світлі, ви можете використати цю «нейтральну» точкову світлову текстуру (клацніть правою кнопкою миші > Зберегти зображення як…):

Нейтральна точкова легка текстура

Нейтральна точкова легка текстура

Якщо вам потрібен інший спад, ви можете процедурно створити текстуру, призначивши New GradientTexture2D властивості Texture світла. Після створення ресурсу розгорніть його розділ Заливка та встановіть режим заливки Радіальний. Потім вам доведеться налаштувати сам градієнт, щоб починатися від непрозорого білого до прозорого білого, і перемістити його початкове місце, щоб воно було в центрі.

Спрямоване світло

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

DirectionalLight2D пропонує такі властивості:

  • Висота: Віртуальна висота світла щодо нормального відображення (0.0 = паралельно до поверхонь, 1.0 = перпендикулярно до поверхонь). За замовчуванням світло повністю паралельне поверхням, які отримують світло. Це зробить освітлення малопомітним, якщо використовується нормальне відображення, тому подумайте про збільшення цього значення. Регулювання висоти світла лише дає візуальну різницю на поверхнях, які використовують звичайне відображення. Висота не впливає на вигляд тіней.

  • Максимальна відстань: максимальна відстань від центральних об’єктів камери може бути до того, як їх тіні будуть видалені (у пікселях). Зменшення цього значення може запобігти відкиданню тіні об’єктами, розташованими за межами камери (при цьому також покращується продуктивність). Збільшення Camera2D не враховується Максимальною відстанню, що означає, що за вищих значень масштабування тіні швидше зникнуть під час масштабування певної точки.

Примітка

Спрямовані тіні завжди виглядатимуть нескінченно довгими, незалежно від значення властивості Висота. Це обмеження методу візуалізації тіні, який використовується для 2D світла в Godot.

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

Загальні світлові властивості

І PointLight2D, і DirectionalLight2D пропонують спільні властивості, які є частиною базового класу Light2D:

  • Увімкнено: дозволяє перемикати видимість світла. На відміну від приховування світлового вузла, вимкнення цієї властивості не приховає дочірніх елементів світла.

  • Лише редактор: якщо ввімкнено, індикатор буде видно лише в редакторі. Він буде автоматично вимкнений у запущеному проекті.

  • Колір: Колір світла.

  • Енергія: Коефіцієнт інтенсивності світла. Вищі значення призводять до яскравішого світла.

  • Режим змішування: Формула змішування, яка використовується для обчислень світла. Типове значення Add підходить для більшості випадків використання. Відняти можна використовувати для негативних вогнів, які не є фізично точними, але їх можна використовувати для спеціальних ефектів. Режим змішування Mix змішує значення пікселів, що відповідають текстурі світла, зі значеннями пікселів під нею шляхом лінійної інтерполяції.

  • Діапазон > Z Min: Найнижчий індекс Z, на який впливає світло.

  • Діапазон > Z Max: Найвищий індекс Z, на який впливає світло.

  • Діапазон > Мінімальний шар: Найнижчий візуальний шар, на який впливає світло.

  • Діапазон > Макс. шар: Найвищий візуальний шар, на який впливає світло.

  • Діапазон > Маска відбракування предметів: контролює, які вузли отримують світло від цього вузла, залежно від увімкнених візуальних шарів інших вузлів Світлова маска заглушення. Це можна використовувати для запобігання потраплянню світла на певні об’єкти.

Налаштування тіней

Після ввімкнення властивості Shadow > Enabled у вузлі PointLight2D або DirectionalLight2D ви спочатку не побачите жодної візуальної різниці. Це пояснюється тим, що жоден вузол у вашій сцені ще не має окклюдерів, які використовуються як основа для відтворення тіні.

Щоб на сцені з’явилися тіні, до сцени потрібно додати вузли LightOccluder2D. Ці вузли також повинні мати багатокутники оклюдера, які відповідають контуру спрайту.

Разом із ресурсом полігону (який має бути налаштований, щоб мати будь-який візуальний ефект), вузли LightOccluder2D мають 2 властивості:

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

  • Occluder Light Mask: використовується разом із властивістю PointLight2D і DirectionalLight2D Shadow > Item Cull Mask, щоб контролювати, які об’єкти відкидають тіні для кожного світла. Це можна використовувати, щоб запобігти відкиданню тіні певними об’єктами.

Існує два способи створення світлопоглиначів:

Автоматичне генерування окклюдера світла

Оклюдери можна створювати автоматично з вузлів Sprite2D, вибравши вузол, клацнувши меню Sprite2D у верхній частині 2D-редактора, а потім вибравши Створити LightOccluder2D Sibling.

У діалоговому вікні, що з’явиться, контур оточуватиме краї вашого спрайту. Якщо контур точно збігається з краями спрайту, ви можете натиснути ОК. Якщо контур надто далеко від країв спрайту (або «в’їдається» в краї спрайту), відрегулюйте Зростання (пікселі) і Зменшення (пікселі), а потім натисніть Оновити попередній перегляд . Повторюйте цю операцію, доки не отримаєте задовільний результат.

Ручне малювання світлоокклюдера

Створіть вузол LightOccluder2D, потім виберіть вузол і натисніть кнопку «+» у верхній частині 2D-редактора. Коли вас попросять створити багатокутний ресурс, дайте відповідь Так. Потім ви можете почати малювати багатокутник оклюдера, клацнувши, щоб створити нові точки. Ви можете видалити існуючі точки, клацивши їх правою кнопкою миші, і ви можете створити нові точки з існуючої лінії, клацнувши лінію та перетягнувши її.

Для двовимірних світильників, у яких увімкнено тіні, можна налаштувати такі властивості:

  • Колір: Колір затінених областей. За замовчуванням затінені області повністю чорні, але це можна змінити для художніх цілей. Альфа-канал кольору контролює, наскільки тінь відтінена вказаним кольором.

  • Фільтр: Режим фільтра для тіней. Стандартне значення Немає є найшвидшим для візуалізації та добре підходить для ігор із естетикою піксельного мистецтва (через його «блокові» візуальні ефекти). Якщо вам потрібна м’яка тінь, використовуйте натомість PCF5. PCF13 є ще м’якшим, але найвибагливішим до візуалізації. PCF13 слід використовувати лише для кількох джерел світла одночасно через високу вартість візуалізації.

  • Filter Smooth: контролює ступінь пом’якшення тіней, коли для Filter встановлено значення PCF5 або PCF13. Вищі значення призводять до м’якшої тіні, але можуть спричинити видимість артефактів смуг (особливо з PCF5).

  • Item Cull Mask: контролює, які вузли LightOccluder2D відкидають тіні, залежно від відповідних властивостей Occluder Light Mask.

Примітка

Роздільна здатність освітлення та тіней у піксельних іграх

Двигун обчислює 2D-освітлення та тіні з роздільною здатністю пікселів вікна перегляду, а не з роздільною здатністю текселя вихідної текстури. Зовнішній вигляд світла та тіней залежить від роздільної здатності вашого вікна або вікна перегляду, а не від роздільної здатності окремих текстур спрайтів.

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

Щоб досягти пікселізованого освітлення та тіней, використовуйте спеціальний шейдер для зміни LIGHT_VERTEX та SHADOW_VERTEX для прив'язки вибірки світла до піксельної сітки. Наступний шейдер прив'язує освітлення до сітки за допомогою функції floor():

shader_type canvas_item;

uniform float pixel_size = 4.0;

void fragment() {
    // Snap lighting and shadows to pixel grid.
    LIGHT_VERTEX.xy = floor(LIGHT_VERTEX.xy / pixel_size) * pixel_size;
    SHADOW_VERTEX = floor(SHADOW_VERTEX / pixel_size) * pixel_size;

    // Normal rendering.
    COLOR = texture(TEXTURE, UV);
}

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

Для отримання додаткової інформації про шейдери елементів полотна див. Шейдери CanvasItem.

Жорсткі тіні

Жорсткі тіні

М'які тіні (PCF13, Filter Smooth 1.5)

М'які тіні (PCF13, Filter Smooth 1.5)

М’які тіні зі смугами артефактів через занадто високий рівень Filter Smooth (PCF5, Filter Smooth 4)

М’які тіні зі смугами артефактів через занадто високий рівень Filter Smooth (PCF5, Filter Smooth 4)

Нормальні та дзеркальні карти

Карти нормалей і дзеркальних карт можуть значно покращити відчуття глибини вашого двовимірного освітлення. Подібно до того, як вони працюють у 3D-візуалізації, карти нормалей можуть допомогти зробити освітлення менш плоским, змінюючи його інтенсивність залежно від напрямку поверхні, на яку потрапляє світло (на піксельній основі). Відзеркальні карти додатково допомагають покращити візуальні ефекти, змушуючи частину світла відбиватися назад до глядача.

Як PointLight2D, так і DirectionalLight2D підтримують відображення нормалей та відображення дзеркала. Відображення нормалей та дзеркала можна призначити будь-якому 2D-елементу, включаючи вузли, що успадковуються від Node2D або Control.

Нормальна карта представляє напрямок, у якому «вказує» кожен піксель. Ця інформація потім використовується механізмом для правильного застосування освітлення до 2D поверхонь у фізично правдоподібний спосіб. Карти нормалей зазвичай створюються з карт висот, намальованих вручну, але їх також можна автоматично генерувати з інших текстур.

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

Порада

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

Щоб налаштувати карти нормалей і/або дзеркальні карти на 2D-вузлі, створіть новий ресурс CanvasTexture для властивості, яка малює текстуру вузла. Наприклад, на Sprite2D:

Створення ресурсу CanvasTexture для вузла Sprite2D

Створення ресурсу CanvasTexture для вузла Sprite2D

Розгорніть новостворений ресурс. Ви можете знайти кілька властивостей, які вам потрібно буде налаштувати:

  • Розсіювання > Текстура: текстура основного кольору. У цій властивості завантажте текстуру, яку ви використовуєте для самого спрайту.

  • Нормальна карта > Текстура: Нормальна текстура карти. У цій властивості завантажте нормальну текстуру карти, яку ви створили з карти висот (див. підказку вище).

  • Specular > Texture: Текстура дзеркальної карти, яка контролює інтенсивність дзеркального відображення кожного пікселя на розсіяній текстурі. Дзеркальна карта зазвичай має відтінки сірого, але вона також може містити колір, щоб відповідно помножити колір відображень. У цій властивості завантажте створену текстуру дзеркальної карти (див. підказку вище).

  • Specular > Color: Коефіцієнт кольору для дзеркальних відображень.

  • Specular > Shininess: дзеркальний показник, який використовується для відображень. Менші значення збільшать яскравість відображень і зроблять їх більш розсіяними, тоді як вищі значення зроблять відбиття більш локалізованими. Високі значення більше підходять для мокрих поверхонь.

  • Текстура > Фільтр: можна налаштувати на заміну режиму фільтрації текстури, незалежно від того, яке значення має властивість вузла (або налаштування проекту Відтворення > Текстури > Текстури полотна > Фільтр текстури за замовчуванням).

  • Текстура > Повторити: можна налаштувати для заміни режиму фільтрації текстури, незалежно від того, яке значення має властивість вузла (або налаштування проекту Відтворення > Текстури > Текстури полотна > Повторення текстури за замовчуванням).

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

Використання додаткових спрайтів як швидшої альтернативи 2D-світла

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

Додаткові спрайти відтворюються набагато швидше, оскільки їм не потрібно проходити через окремий конвеєр відтворення. Крім того, можна використовувати цей підхід із AnimatedSprite2D (або Sprite2D + AnimationPlayer), який дозволяє створювати анімовані 2D-світла.

Однак адитивні спрайти мають кілька недоліків порівняно з 2D-світлом:

  • Формула змішування неточна порівняно з «фактичним» двовимірним освітленням. Зазвичай це не проблема в достатньо освітлених місцях, але це заважає додатковим спрайтам правильно освітлювати повністю темні області.

  • Адитивні спрайти не можуть відкидати тіні, оскільки вони не є світлом.

  • Адитивні спрайти ігнорують нормальні та дзеркальні карти, які використовуються в інших спрайтах.

Щоб відобразити спрайт за допомогою адитивного змішування, створіть вузол Sprite2D і призначте йому текстуру. інспекторі прокрутіть униз до розділу CanvasItem > Material, розгорніть його та клацніть спадне меню поруч із властивістю Material. Виберіть New CanvasItemMaterial, клацніть щойно створений матеріал, щоб відредагувати його, а потім встановіть для Blend Mode значення Add.