Использование редактора тем

В этой статье объясняется, как создавать и управлять темами пользовательского интерфейса с помощью редактора Godot и его инструмента для редактирования тем. Рекомендуем ознакомиться с основами создания тем и скинов графического интерфейса, прочитав документ Введение в skinning графического интерфейса, прежде чем начать.

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

Создание темы

Как и любые другие ресурсы, темы можно создавать непосредственно в доке файловой системы, щёлкнув правой кнопкой мыши и выбрав New Resource..., затем выбрав Theme и нажав Create. Это особенно полезно для создания тем для всего проекта.

Темы также можно создавать из любого узла управления. Выберите узел управления в иерархии сцены, затем в инспекторе перейдите к свойству theme. Там вы можете выбрать New Theme.

../../_images/new_theme.webp

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

Хотя редактор тем предоставляет инструменты для управления типами и элементами тем, темы также включают в себя резервный шрифт по умолчанию, который можно редактировать только через панель инспектора. То же самое относится к содержимому сложных типов ресурсов, таких как StyleBoxes и значки — они открываются для редактирования в инспекторе.

../../_images/default_font.webp

Обзор редактора тем

../../_images/theme_editor.webp

Редактор тем состоит из двух основных частей. Основной редактор тем, расположенный в нижней части редактора Godot, предназначен для предоставления пользователям инструментов для быстрого создания, редактирования и удаления элементов и типов тем. Он предоставляет визуальные инструменты для выбора и изменения элементов управления, абстрагируя основные концепции тем. Диалог Manage Theme Items, с другой стороны, пытается удовлетворить потребности тех, кто хочет изменить темы вручную. Оно также полезно для создания новой темы редактора.

Предварительные просмотры тем

В левой части главного редактора расположен набор вкладок предварительного просмотра. Вкладка Default Preview отображается сразу после установки и содержит большинство часто используемых элементов управления в различных состояниях. Предпросмотры интерактивны, поэтому можно просматривать и промежуточные состояния (например, при наведении курсора).

../../_images/default_preview.webp

Дополнительные вкладки можно создавать из произвольных сцен вашего проекта. Для использования в качестве предварительного просмотра сцена должна иметь корневой узел управления. Чтобы добавить новую вкладку, нажмите кнопку Add Preview и выберите сохранённую сцену в файловой системе.

../../_images/scene_preview.webp

Если вы внесёте изменения в сцену, они не будут автоматически отражены в предварительном просмотре. Чтобы обновить предварительный просмотр, нажмите кнопку "update" на панели инструментов.

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

../../_images/theme_preview_picker.webp

Типы тем и предметы

В правой части редактора тем представлен список типов тем, доступных в редактируемом ресурсе темы, и содержимое выбранного типа. Список элементов типа разделен на несколько вкладок, соответствующих каждому типу данных, доступному в теме (цвета, константы, стили и т.д.). Если опция Show Default включена, то для каждого встроенного типа отображаются значения темы по умолчанию, выделенные серым цветом. Если опция отключена, то отображаются только те элементы, которые доступны в самой редактируемой теме.

../../_images/theme_type_editor.webp

Отдельные элементы из темы по умолчанию можно добавить в текущую тему, нажав на кнопку Override рядом с элементом. Вы также можете переопределить все элементы по умолчанию выбранного типа темы, нажав на кнопку Override All. Переопределенные свойства можно удалить с помощью кнопки Remove Item. Свойства также можно переименовать с помощью кнопки Rename Item, а полностью пользовательские свойства можно добавить в список с помощью текстового поля под ним.

Переопределенные элементы темы можно редактировать непосредственно на правой панели, если только они не являются ресурсами. Для ресурсов доступны элементарные элементы управления, но редактировать их необходимо в панели инспектора.

../../_images/theme_item_inspector.webp

В StyleBox доступна уникальная функция, позволяющая закрепить отдельный StyleBox из списка. Закреплённый StyleBox действует как лидер, и все StyleBox того же типа обновляются вместе с ним при изменении его свойств. Это позволяет редактировать свойства нескольких StyleBox одновременно.

../../_images/theme_pin_the_stylebox.webp

Хотя типы тем можно выбрать из предварительного просмотра, их также можно добавить вручную. Нажатие кнопки со знаком "плюс" рядом со списком типов открывает меню Add item Type. В этом меню можно выбрать тип из списка или ввести произвольное имя для создания пользовательского типа. Текстовое поле также фильтрует список узлов управления.

../../_images/add_item_type.webp

Управление и импорт элементов

Нажатие кнопки Manage Items открывает диалоговое окно Manage Theme Items.

../../_images/manage_items_button.webp

На вкладке Edit Items вы можете просматривать и добавлять типы тем, а также просматривать и редактировать элементы темы выбранного типа.

../../_images/manage_items.webp

Здесь можно создавать, переименовывать и удалять отдельные элементы темы, щелкнув по соответствующему адресу Add X Item и указав их название. Вы также можете массово удалить элементы темы либо по их типу данных (с помощью значка кисти в списке), либо по их качеству. Remove Class Items удалит все встроенные элементы темы, которые вы настроили для типа узла управления. Remove Custom Items удалит все пользовательские элементы темы для выбранного типа. Наконец, Remove All Items удалит все элементы из типа.

На вкладке Import Items можно импортировать элементы темы из других тем. Вы можете импортировать элементы из стандартной темы Godot, темы редактора Godot или другой пользовательской темы. Вы можете импортировать отдельные или несколько элементов, а также копировать или исключать их данные. Существует несколько способов выбора и отмены выбора элементов: вручную, по иерархии, по типу данных и т.д. Если вы выберете включение данных, все элементы темы будут скопированы в вашу тему в их текущем виде. Если вы исключите данные, будут созданы элементы с соответствующим типом данных и именем, но они останутся пустыми, что в некотором роде создаст шаблон темы.

../../_images/import_items.webp