Manuals
Manuals




This translation is community contributed and may not be up to date. We only maintain the English version of the documentation. Read this manual in English

Текстові вузли GUI

Defold підтримує окремий тип вузла GUI, що дає змогу відображати текст у сцені GUI. Для рендерингу текстових вузлів можна використовувати будь-який ресурс шрифту, доданий до проєкту.

Попередній перегляд у редакторі підтримує формування гліфів і компонування справа наліво за допомогою засобу рендерингу шрифтів рушія. Потрібні налаштування шрифтів і маніфеста застосунку описано в розділі Підтримка компонування тексту.

Додавання текстових вузлів

Шрифти, які ви хочете використовувати в текстових вузлах GUI, потрібно додати до компонента GUI (GUI component). Для цього натисніть правою кнопкою миші на папці Fonts, скористайтеся верхнім меню GUI або натисніть відповідне сполучення клавіш.

Шрифти

Текстові вузли мають набір особливих властивостей:

Font
Для кожного створеного текстового вузла потрібно задати властивість Font.
Text
Ця властивість містить текст, що відображається.
Line Break
Вирівнювання тексту залежить від налаштування опорної точки (pivot), а ввімкнення цієї властивості дає змогу розміщувати текст у кілька рядків. Ширина вузла визначає, де текст переноситиметься на новий рядок.

Векторні шрифти й кольорові емодзі

Виконайте налаштування векторного шрифту, додайте ресурс .font до Fonts сцени GUI й виберіть його у текстовому вузлі. Задайте Material ресурсу шрифту як /builtins/fonts/font-vector.material. Використовуйте Font Size вузла, щоб керувати розміром відображення.

Для кольорових емодзі також виконайте налаштування резервного COLRv1-шрифту й пакування. Створіть текстовий вузол з ідентифікатором text, залиште його Text порожнім і додайте такий код до .gui_script сцени GUI:

function init(self)
    local node = gui.get_node("text")
    local text = "Hello 😀 🍎 🚀"
    local font_resource = gui.get_font_resource(gui.get_font(node))
    -- Add the fallback once for this shared font resource.
    font.add_font(font_resource, "/fonts/NotoColorEmoji-Regular.ttf")
    font.prewarm_text(font_resource, text, function(self, request_id, result, err)
        if result then
            gui.set_text(node, text)
        else
            print("Could not prepare GUI text:", err)
        end
    end)
end

gui.get_font() повертає назву шрифту в сцені GUI; gui.get_font_resource() перетворює цю назву на ресурс шрифту, який використовує font.add_font(). Інші вузли й компоненти Label, що спільно використовують ресурс, також отримують резервний шрифт, тому ініціалізуйте його лише один раз. Текст задається після успішної попередньої підготовки.

Вирівнювання

Змінюючи опорну точку вузла, ви можете змінити режим вирівнювання тексту.

По центру
Якщо для опорної точки встановлено значення Center, North або South, текст вирівнюється по центру.
Ліворуч
Якщо для опорної точки встановлено будь-який із режимів West, текст вирівнюється за лівим краєм.
Праворуч
Якщо для опорної точки встановлено будь-який із режимів East, текст вирівнюється за правим краєм.

Вирівнювання тексту

Змінення текстових вузлів під час виконання

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

  • Щоб змінити шрифт текстового вузла, використовуйте функцію gui.set_font().
  • Щоб змінити поведінку перенесення рядків у текстовому вузлі, використовуйте функцію gui.set_line_break().
  • Щоб змінити вміст текстового вузла, використовуйте функцію gui.set_text().
function on_message(self, message_id, message, sender)
    if message_id == hash("set_score") then
        local s = gui.get_node("score")
        gui.set_text(s, message.score)
    end
end