Шкала здоровья — 3 варианты

Проблема

Вам нужно отобразить шкалу с контейнерами здоровья (или другую шкалу, основанную на иконках).

Решение

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

В этом руководстве мы рассмотрим три способа отображения этой информации, которые я называю «простой», «пустой» и «частичный»:

На этом изображении показано, как выглядит шкала, когда у игрока 3 единицы здоровья.

• Простой (simple): Отображаются только заполненные сердца.
• Пустой (empty): Показываются пустые контейнеры сердец.
• Частичный (partial): Контейнеры могут быть частично заполнены.

Настройка шкалы

Используемые изображения сердец имеют размер 53×45 пикселей. Их можно скачать здесь: Kenney.nl: Platformer Art Deluxe

Идеально, если шкалу здоровья можно легко встроить в ваш HUD/UI. Поэтому логично сделать её отдельной сценой. Начнем с HBoxContainer, который поможет правильно выровнять элементы. В параметрах Theme Overrides/Constants/Separation установите значение 5.

Добавьте дочерний элемент TextureRect. Перетащите текстуру сердца в его свойство Texture и установите Stretch Mode в «Keep». Назовите узел «1», затем нажмите «Ctrl-D», чтобы продублировать его столько раз, сколько необходимо (например, 5). Ваша структура узлов должна выглядеть так:

Добавление скрипта

Проверь свои знания в нашем бесплатном ТЕСТЕ по Godot! Узнай, насколько хорошо ты его знаешь!

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

Сначала загрузим необходимые текстуры и определим три режима шкалы:

extends HBoxContainer

enum modes {SIMPLE, EMPTY, PARTIAL}

var heart_full = preload("res://assets/hud_heartFull.png")
var heart_empty = preload("res://assets/hud_heartEmpty.png")
var heart_half = preload("res://assets/hud_heartHalf.png")

@export var mode : modes

func update_health(value):
    match mode:
        MODES.simple:
            update_simple(value)
        MODES.empty:
            update_empty(value)
        MODES.partial:
            update_partial(value)

Вызов метода update_health() заставит шкалу отобразить переданное значение в зависимости от выбранного режима.

Важно:
Мы не будем проверять входное значение на выход за пределы допустимого диапазона. Ваша система здоровья может быть реализована по-разному, поэтому эта проверка остаётся на ваше усмотрение.

Сначала рассмотрим метод update_simple(). Здесь мы просто проходим по контейнерам сердец и управляем их видимостью:

func update_simple(value):
    for i in get_child_count():
        get_child(i).visible = value > i

Метод update_empty() очень похож, но вместо скрытия иконки мы заменяем её на пустой контейнер:

func update_empty(value):
    for i in get_child_count():
        if value > i:
            get_child(i).texture = heart_full
        else:
            get_child(i).texture = heart_empty

Для частично заполненных контейнеров используется третья текстура, а также увеличенное количество возможных состояний:

func update_partial(value):
    for i in get_child_count():
        if value > i * 2 + 1:
            get_child(i).texture = heart_full
        elif value > i * 2:
            get_child(i).texture = heart_half
        else:
            get_child(i).texture = heart_empty

Пример использования каждого из режимов шкалы:

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