Готовый перевод CEGUI In Practice / CEGUI на практике: 1. Introduction

Добро пожаловать в первый туториал из серии, помогающей понять как использовать CEGUI.

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

И все же я постараюсь время от времени применять .layout.

Однако, как только вы поймете, как использовать объекты в коде, вам станет легче использовать их в скриптах.

[Прошу заметить, что я использую Ogre3D, так что все предустановки будут ориентированы на него.]

Введение в CEGUI

Первый момент - CEGUI использует множество самостоятельных классов.

Это позволяет иметь глобальный доступ к классу во всем коде, но при этом иметь лишь один его экземпляр.

Далее следуют классы, которые мы будем использовать в этом туториале.

CEGUI::System - самый главный шаман. Класс содержит множество функций для установки и получения доступа к различным параметрам.

CEGUI::WindowManager - управляет окнами CEGUI. Если вам нужно создать новое окно или удалить старое, WindowManager то, что вам нужно.

CEGUI::SchemeManager - управляет схемами.

CEGUI::FontManager - управляет различными шрифтами, которые вы будете использовать в своем приложении.

Для начала

Давайте приступим к работе и немного поговорим о процессе установки.

Первое, что нужно сделать, это настроить систему и запуститься.

Поскольку я использую Ogre, то я покажу код для настройки и запуска системы под Ogre.

Есть множество способов запустить CEGUI для других систем рендеринга,

которые описанны здесь <i>ссылка</i>.

Вот способ для Ogre3d:

Подключение необходимых заголовков
Настройка CEGUI

[Примечание: Это новый метод, использующий функцию bootstrapSystem(), которая была введена в CEGUI 0.7.1. На вики есть примеры для более старых версий CEGUI. Обратите внимание на версию которую вы используете.]

Код, приведенный выше, создает экземпляр системы отображения Ogre3D для CEGUI.

После того, как вы пропишите его, вам не придется больше беспокоится о взаимосвязи библиотек.

Он создает связь, которую Ogre использует для отображения элементов CEGUI.

Следует заметить, что писать нужно именно так, если Ogre автоматически создает окно отображения (распространенный вариант).

Если вы вручную создаете окно Ogre, то вам нужно будет вызвать перегруженную функцию CEGUI::OgreRenderer::bootstrapSystem (Ogre::RenderWindow*).

Также стоит упомянуть, что bootstrapSystem() создает экземпляр CEGUI::System.

Это важно, так как если у вас уже был создан CEGUI::System, вылезет ошибка.

Ой-ой, теперь скрипты

Теперь, когда мы оговорили очень скучные функции,

нам нужно узнать основную информацию о CEGUI, перед тем как продолжать.

CEGUI использует ОЧЕНЬ много скриптов.

Большинство из которых, определяющие объекты CEGUI, находятся в различных .xml файлах.

Для начала стоит рассказать о схемах (*.scheme).

Любой объект, который вы будете использовать в вашем GUI, будет определен в .scheme файле.

Также файл будет содержать информацию о других скриптах, описанных ниже.

В последующих туториалах этот файл будет описан более подробно.

Ниже приведен пример, можете пробежаться по нему глазами:

Следующий вид скриптов о котором мы будем говорить - разметка (*.layout).

Это также xml файл, который определяет разметку (вполне очевидно) окна, которое нужно отобразить на экране.

К примеру, если мы хотим создать окно чата, то где-нибудь у нас должен быть файл ChatWindow.layout.

Там будет описано как окно будет выглядеть (насколько оно будет большое, где на экране будет расположено и т.д.), где внутри этого окна будет поле для ввода сообщения, а где кнопка "отправить".

Ниже приведен пример того, как примерно выглядит .layout файл:

Другой вид скриптов, о котором стоит упомянуть - это шрифты (*.font).

С помощью него описываются шрифты, которые вы будете использовать. Ниже пример:

Еще один не менее важный вид скриптов - Imageset (*.imageset).

В файлах этого типа определяется визуальный образ каждого объекта.

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

К примеру, графическое представление обычной кнопки в .imageset будет некая позиция в изображении текстуры (*.png, *.bmp, *.jpg, и т.д.) с определенной высотой и шириной.

Она может быть расположена в пикселе 100х320 и иметь размер 50х50.

Так в файле и будет записано. Ниже приведен пример.

Ну и последний вид LookNFeel (*.looknfeel).

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

В файлах этого типа определяется как каждый объект выглядит и действует.

Как он выглядит, когда на него наведена мышь, или как обрамить окно и добавить фоновый цвет.

Как правило каждая у каждой схемы свой LookNFeel, это позволяет более удобно модифицировать конструкцию основных CEGUI объектов.

Обратно к началу

Теперь, когда мы знаем тот минимум о скриптах, которые использует CEGUI (И не беспокойтесь, они очень полезные и не такие страшные. В дальнейшем

вы скорее всего будете очень много использовать .layout.), давайте сделаем что-нибудь стоящее.

Там, где мы остановились, CEGUI только начинается.

Но сам он не знает, что вы хотите делать.

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

Как упоминалось выше, схема содержит список объектов и скриптов. Схема может включать в себя Imageset, lookNFeel и шрифты.

Довольно просто можно воспользоваться шрифтом или imageset, которые не включены в схему.

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

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

Теперь давайте установим парочку параметров:

Мы вызываем CEGUI::System и устанавливаем шрифт и курсор мыши по умолчанию.

Если посмотрите в TaharezLook.scheme (находится в папке cegui/datafiles/schemes),

то увидите, что был загружен шрифт, отмеченный в схеме, с именем DejaVuSans-10.font.

Курсор мыши можно найти в imageset с именем "TharezLook" под тегом "MouseArrow".

Надеюсь понятно объяснил.

Отлично, теперь CEGUI знает о некоторых основных параметрах, которые нам понадобятся.

Давайте создадим корневое окно, куда все и запихнем.

Для организации окон CEGUI использует систему наследования.

Значит необходимо создать главное родительское окно, для которого все остальные окна будут детьми.

Функция вызывает класс WindowManager и создает окно типа "DefaultWindow" с именем "_MasterRoot".

Обычное окно, это обычное окно, пустое (ну или прозрачное).

Корневое окно может быть названо как угодно, мне нравится "_MasterRoot", так как я вряд ли назову какое-либо другое окно так же.

Теперь, когда мы создали окно, нам нужно сделать его корневым окном.

Мы вызываем CEGUI::System и определяем myRoot как окно по умолчанию.

Напомню, что myRoot был создан выше с именем "_MasterRoot".

Заключение

Конечно не супер крутой туториал, но все же.

На данный момент CEGUI настроен, и мы можем начать добавлять окна, проводить различные махинации с окнами, кнопками, вводом или просто повеселится.

В следующих туториалах будет продемонстрировано, как CEGUI распознает щелчки мыши, перетаскивание окон, ввод с клавиатуры и даже больше.

Спасибо за прочтение!

Внимание! Этот перевод, возможно, ещё не готов.
Его статус: перевод редактируется

Переведено на Нотабеноиде
http://notabenoid.org/book/29927/101767

Переводчики: proVIDec