В Части 1 мы обсуждали, что такое ScriptableObjects и как они работают, теперь мы посмотрим, как их можно реализовать таким образом, чтобы получить чистый, расширяемый и быстро модифицируемый пользовательский интерфейс. Обратите внимание, что эти руководства будут сосредоточены только на механике, данных и сценариях нашего пользовательского интерфейса, вся часть дизайна зависит от каждого человека (и поверьте мне, вы действительно не хотите получать от меня советы по дизайну). То, что вы получите, — это набор элементов пользовательского интерфейса, которые вы сможете быстро настроить и в любое время поменять местами свои спрайты и изменить их. Это также означает, что работа с дизайнером не является проблемой, все готово для импорта ваших графических ресурсов в любое время, вы можете работать с плейсхолдерами, пока ваш дизайнер работает над активами, и в конце вы просто обмениваетесь ими, и все уже готово .

Структура файла

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

  • Папка Редактор предназначена для опций контекстного меню, позволяющих создавать ресурсы, щелкнув правой кнопкой мыши в любом месте папки проекта.
  • Папка Resources содержит все префабы, которые мы создаем из контекстного меню,
  • Папка Graphics содержит все спрайты и графические ресурсы,
  • Папка Data содержит все экземпляры наших ScriptableObjects,
  • Папка GraphicElements содержит все классы для наших панелей, кнопок и других ресурсов,
  • Папка AnimatedElements содержит все скрипты, которые прикрепляются к объектам, чтобы заставить их анимироваться (скользить вверх/вниз/в сторону, увеличиваться в размере, изменять форму при нажатии…)
  • Будучи помешанным на порядке, я также поместил свои интерфейсы и базовые классы для унаследованных элементов в BaseClasses.

Основной скин пользовательского интерфейса

Все активы, цвета и скины находятся в одном файле ScriptableObject. Этот объект почти не отличается от ссылки на учебник, которую я разместил в части 1, поэтому вы можете ознакомиться с этим руководством для получения подробной информации. Моя реализация просто добавляет еще несколько элементов и расширяется, когда я придумываю новые идеи элементов пользовательского интерфейса:

Базовый класс

Основной класс для всех элементов пользовательского интерфейса — это класс, от которого будут наследоваться все элементы пользовательского интерфейса, что значительно снижает необходимость многократного переписывания большого количества кода:

Этот код также во многом заимствован из туториалов, я в основном просто добавил логическое значение, которое вы можете отметить/снять, чтобы оно не обновлялось в редакторе, так как оно ломает некоторые анимированные элементы при их тестировании. Во встроенном приложении это всегда ложно, поэтому это не влияет на фактическое приложение.

Далее, используя наследование, вы можете создать базовые классы для различных элементов, например, базовый класс AnimatedPanel для всех выдвижных ящиков и панелей или класс InteractableGraphic для всех различных кнопок. Это значительно сокращает код, необходимый для различных подэлементов. Пример реализации базового класса для класса InteractableGraphic:

Выполнение

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

В этом случае ButtonSize относится к ScriptableObject, который сохраняет размеры кнопки, которые мы можем установить в редакторе, и каждая кнопка, которой назначен один и тот же экземпляр элемента ButtonSize, всегда будет одного размера.

Для элементов, которые могут быть похожи по сути, но по каким-либо причинам имеют очень разные реализации, вы можете использовать Interface, чтобы вы могли вызывать один и тот же метод с очень разными реализациями. Пример интерфейса для класса панели:

Теперь каждая панель должна реализовывать эти функции, но они могут различаться по своей реализации, но в редакторе Unity вы все равно увидите каждую панель, которая реализует их, например, с помощью метода ShowOrHideDrawer.

Это было много кода, надеюсь, вы нашли его полезным в своих проектах. Если у вас есть какие-либо вопросы, дайте мне знать, в следующей части мы реализуем несколько примеров анимированных меню.

Первоначально опубликовано на сайте augmentistdev.wordpress.com 1 июня 2018 г.