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.

Полотняні шари

Елементи Вікно перегляду та Полотна

CanvasItem є основою для всіх 2D-вузлів, таких як Node2D, або Control. Обидва успадковуються від CanvasItem. Ви можете додавати вузли CanvasItem в дерево. Кожен елемент успадкує батьківські перетворення: це означає, що коли предка перенесуть, перемістяться і нащадки.

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

Властивість Viewport Viewport.canvas_transform дозволяє застосувати спеціальне перетворення Transform2D до ієрархії CanvasItem, яку він містить. Такі вузли, як Camera2D, працюють, змінюючи це перетворення.

Для досягнення таких ефектів, як прокрутка, краще маніпулювати з властивістю перетворення полотна, ніж з переміщенням елемента кореневого полотна та всієї сцени з ним.

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

  • Паралакс фони: Фони, які рухаються повільніше, ніж решта сцени.

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

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

Як вирішити ці проблеми в одному дереві сцен?

CanvasLayers (Полотняні шари)

Відповідь - CanvasLayer, це вузол, який додає окремий шар 2D-рендерингу для всіх своїх нащадків. Нащадки вікна перегляду за замовчуванням малюватимуть на шарі "0", тоді як CanvasLayer малюватиме на будь-якому числовому шарі. Шари з більшим числом будуть намальовані поверх шарів з меншим числом. CanvasLayers також мають власну трансформацію і не залежать від трансформації інших шарів. Це дозволяє інтерфейсу користувача фіксуватися в просторі екрана, поки наш погляд на ігровий світ змінюється.

Прикладом цього є створення паралаксного фону. Його можна зробити за допомогою CanvasLayer на шарі "-1". Екран з точками, лічильником життя та кнопкою паузи також можна створити на шарі "1".

Ось схема того, як це виглядає:

../../_images/canvaslayers.png

CanvasLayers не залежать від порядку в дереві, вони залежать лише від номера шару, тому їх можна створити за потреби, коли це потрібно.

Примітка

CanvasLayers не потрібні для керування порядком малювання вузлів. Стандартний спосіб переконатися, що вузол правильно намальований «попереду» або «позаду» інших — це маніпулювати порядком вузлів на панелі сцени. Можливо, це суперечить інтуїції, але найвищі вузли панелі сцени намальовані позаду нижніх у вікні перегляду. Двовимірні вузли також мають властивість CanvasItem.z_index для керування порядком малювання.