В предыдущей статье мы разработали и реализовали наш пользовательский интерфейс, теперь пора его использовать!
Чтобы иметь возможность привязать наши модели данных: Item, ItemDatabase, Inventory, к нашему пользовательскому интерфейсу, мы создадим два новых сценария C # с именами: UIItem, UIInventory:
Затем удаляем все слоты, кроме первого:
И создайте внутри него новое изображение:
Где мы поместим спрайт элемента для его тестирования, чтобы он, как мы видим, по умолчанию слишком большой:
Делаем его под прорезь:
А изменив цвет слота, мы могли бы сделать его лучше:
А затем мы также можем изменить цвет InventoryPanel:
Итак, когда мы продублируем слот, мы увидим:
После этого мы хотим переименовать изображение как элемент и добавить к нему сценарий UIItem, который будет обрабатывать, как обновлять сам значок элемента:
Затем мы перетаскиваем UIInventory в InventoryPanel:
Также давайте сделаем сборный из этого слота. Для этого мы создадим папку Prefabs внутри Resources, а затем перетащим слот из Hierarchy в Project:
Выполнив эту задачу, мы можем удалить слот в иерархии, а затем с помощью скрипта динамически заполним инвентарь нашими слотами.
Пришло время поработать со скриптом UIItem! Сначала мы хотим, чтобы наш UIItem знал, что такое Item, какие данные связаны, и мы сделаем это с помощью общедоступной переменной. Затем мы хотим знать, какое изображение прикреплено, чтобы иметь возможность его использовать:
Обратите внимание, что если мы хотим использовать тип изображения, нам нужно писать, используя UnityEngine.UI; Вдобавок вам может быть интересно, как GetComponent ‹Image› (); работает. Он получает компонент внутри объекта, к которому прикреплен этот скрипт UIItem, в данном случае элемент внутри слота:
Давайте определим, за что будет отвечать UIItem. Значок элемента будет отображаться и скрываться, чтобы показать, что слот заполнен или пуст.
Логика следующая: если есть элемент, который нужно обновить, это означает, что если мы хотим показать элемент, его цвет будет непрозрачным белым, и мы берем значок из нового элемента и помещаем его в пользовательский интерфейс. Если элемента нет, это означает, что мы хотим его скрыть, поэтому мы устанавливаем альфа равным 0 с цветом, который называется clear, чтобы полностью скрыть значок.
Также, поскольку мы хотим иметь по умолчанию хотя бы один пустой слот для целей тестирования в SlotPanel, мы напишем следующее:
Затем мы хотим передать UIInventory его ответственность: отслеживать все UIItems и иметь возможность определять, какие из них являются видимыми или нет, и где они находятся.
Итак, основная задача UIInventory будет заключаться в обработке списка со всеми элементами UIItem. Кроме того, мы хотим сохранить slotPrefab, чтобы иметь возможность динамически его порождать. Кроме того, интересно иметь ссылку на slotPanel, потому что она будет родительским элементом, контейнером для всего нового контента.
Теперь пора создать столько слотов, сколько нам нужно, чтобы заполнить наш инвентарь. Для этого мы пишем цикл для создания каждого слота на панели, а затем сохраняем его в списке uiItems:
Чтобы мы могли отображать / скрывать любой элемент, который нам нужен, мы хотим иметь специальную функцию, которая будет следующей:
А как насчет попытки добавить новый элемент? Мы могли бы добавить его, найдя первый слот, где нет элемента, и вставив его туда:
И мы также можем пожелать удалить элементы, для этого мы находим их и передаем нуль:
Итак, главный вопрос: как использовать методы, которые мы написали в UIInventory?
Нам нужно перейти в инвентарь, а затем получить ссылку на наш UIInventory:
А затем интересно вставить оператор, чтобы сообщить нашему UIInventory о добавлении элемента:
А также мы должны удалить элементы, используя UIInventory:
Затем мы можем перейти к редактированию единства и поместить необходимые ссылки в InventoryPanel:
Также мы хотим перейти к GameObject Player и поместить ссылку на InventoryUI:
Итак, давайте запустим игру. Если мы нажмем кнопку воспроизведения:
Мы увидим, что слоты создаются динамически, а рендеринг элементов. Такое поведение связано с тем, что мы добавляем и удаляем элементы в методе Inventory's Start:
Если мы, например, сохраним все три элемента, мы увидим их все:
Надеюсь, мы связали нашу модель данных с нашим пользовательским интерфейсом. В следующей статье мы реализуем функцию перетаскивания.
