Интерфейс

Данная статья посвящена функциональным возможностям наших Редакторов: Редактору сцен, Редактору ресурсов и Редактору текстов.

Редактор сцен

Редактор сцен — программа, предназначенная для создания, редактирования и экспорта игровых экранов, в котором происходит настройка свойств объектов и игровой логики.

Окно редактора сцен состоит из:

• меню редактора;
• рабочей области, в которой размещен обьект сцена, на котором размещают другие обьекты;
• панель Лэйаут, в которой размещено иерархическое дерево проекта, которое состоит из экранов, на которых находятся игровые объекты;
• панель Свойства, которая отображает свойства объекта, который выбран в дереве проекта;
• панель для построения сплайна;
• панель инструментов;
• строка Координаты, отображающая координаты курсора в текущий момент времени
  

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

Меню редактора

Project (Проект)

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

• New project - создать новый проект;
• Open - открыть уже созданный проект (проект обязательно должен находится в подкаталоге редактора);
• Recent project... - показывает список последних открывавшихся проектов;
• Close - закрытие проекта (редактор при этом не закрывается);
• New project - создать новый проект;
• Save - сохранение проекта;
• Save as... - сохранение проекта под новым именем или в новом каталоге;
• Export... - экспорт проекта;
• Project options... - опции проекта;
• Exit - закрытие редактора.

Edit (Редактирование)

меню редактирования проекта:

• Copy - копирование объекта;
• Paste into current object - вставка объекта в выбранный объект;
• Paste after current object - вставка объекта после выбранного объекта;
• Delete... - удаление объекта;
• Delete temp data - удаление опций;
• Find object... - поиск объекта по id или по имени;
• Setup Editor... - настройки редактора.

View (Просмотр)

меню запуска Вьювера (Viewer)- проигрывателя созданного экрана проекта:

• Start Viewer - запуск вьювера;
• Start Viewer with changed time - запуск вьювера с заданным временем;
• Setup Viewer... - настройки окна вьювера для выбранного проекта.

Layouts (Лейаут, Макеты)

меню работа с лейаутами проекта (выбор макета устройства для проекта, редактирование экранов):

• Add new layout... - создание нового лейаута;
• Delete layout... - удаление лейаута;
• Layout settings... - настройки лейаута;
• Add folder... - создание папки в текущем лейаута;
• Add screen... - создание нового экрана.

Tools (Инструменты)

меню дополнительных редакторов и инструментов для проекта (вызов редактора ресурсов, текстового редактора, анализ проекта). Список этого меню вынесен на панель с кнопками быстрого запуска:

• Resources Editor - редактор ресурсов;
• Texts Editor - текстовый редактор;
• Analyzer - анализатор ресурсов (показывает колличество объектов проекта, их размер занимаемой памяти, сведения о ресурсах каждого объекта (размер, ID номер, название (имя), местонахождение в базе ресурсов));
• Object info... - общие свойства объекта (показывает размер памяти занимаемой текстурами);
• Options info... - информация об опциях.

Help (Помощь)

меню вызова справки.

Кнопки панели Инструменты

Некоторые инструменты также вызываются горячими клавишами (комбинация клавиш приведена в скобках )

(Ctrl+N) — создать новый проект;
(Ctrl+O) — загрузить уже созданный проект;
(Ctrl+S) — сохранить изменения в проекте;
— запустить Viewer;
— нормальный вид;
- вызов текстового редактора;
— вызов редактора ресурсов;
— анализатор ресурсов (показывает колличество объектов проекта, их размер занимаемой памяти, сведения о ресурсах каждого объекта (размер, ID номер, название (имя), местонахождение в базе ресурсов));
— поиск объекта по id или по имени.

Функции рабочей области

1) Масштабирование рабочей области
Ctrl + колесико мышки крутим вперед - увеличиваем обьекты , назад - уменьшаем обьекты.

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

Кликаем правой кнопкой мыши по горизонтальному scroll и выпадает меню:

• scroll here — функция перемещает экран к обьекту, который выделен в Лэйауте;
• scroll left / right - функция перемещает экран на маленькое расстояние вправо / влево;
• left / right edge — функция перемещает экран в левый / правый угол экрана;
• page left / right - функция показывает левую/правую часть экрана
  

Кликаем правой кнопкой мыши по вертикальному scroll и выпадает меню:

• scroll here — функция перемещает экран к обьекту, который выделен в Лэйауте;
• scroll up / down - функция перемещает экран на маленькое расстояние вверх / вниз;
• top/bottom - функция перемещает экран вверх / вниз;
• page up / down - функция перемещает экран верхнюю / нижнюю часть экрана.
  

Меню прокрутки скрывается по нажатию клавиши Alt

Функции панели Лэйаут

При клике правой кнопкой мыши по выбраному лэйауту (см. рисунок справа)

• Создать папку в текущем обьекте;
• Создать экран в текущем обьекте - создание обьекта в текущем лэйауте;
• Импорт/экспорт экранов — импорт/экспорт одного или нескольких экранов;
• Развернуть / Свернуть обьекты с подобъектами — сворачивает / разворачивает дерево обьектов всех экранов
  

При клике правой кнопкой мыши по выбраному экрану, сцене или обьекту возможно:

• Создать сцену в текущем обьекте - создание экран в текущем экране;
• Создать экран в текущем обьекте - создание экран в текущем лэйауте;
• Создать обьект сцены в текущем обьекте - создание обьекта в текущем обьекте;
• Удалить обьект - удаление обьекта из проекта;
• Копировать обьект — копирование обьекта;
• Вставить в текущий обьект — вставка обьекта в текущий обьект верхнего уровня ;
• Вставить как ссылку в текущий обьект — вставка обьекта в текущий обьект для создания расшариной сцены;
• Вставить как ссылку после текущего обьекта — вставка обьекта после текущего обьекта для создания расшариной сцены;
• Вставить после текущего обьекта - вставка обьекта после текущего обьекта;
• Импорт/экспорт экранов — импорт/экспорт одного или нескольких экранов;
• Развернуть / Свернуть обьекты с подобъектами — сворачивает /разворачивает дерево обьектов экрана или сцены;

Важное замечание по функции Расположить сцену в соответствии с изображением

Пусть на сцене будет находится очень много картинок, которые должны находиться в строго определенных местах. Переместим нашу картинку в нужную точку на сцене. Но у нас картинок очень много и мы потратим много времени на их расстановку. Для уменьшения времени на расстановку картинок воспользуемся функцией расположить сцену в соответствии с изображением.
Функция расположить сцену в соответветствии с изображнием перемещает картинку в заданную точку художниками. Художник решил, что клубма должна быть в правом нижем углу, после применения функции расположить сцену в соответветствии с изображнием, картинка станет именно на указанное художником место.

Данная функция вызвается кликом правой кнопкой мыша по обьекту

Функции панели Свойства

• При клике на тип или имя некоторых обьектов вызываются дополнительные окна.Например, при клике на тип Machine открывается окно, где прописываются функции обьекта типа Machine.
• При наведении на поле тип выпдает подсказка с уникальным номером обьекта.
• При клике правой мышкой по названию свойства обьекта выпадает меню с дополнительными свойствами обьекта
• Некоторые свойства обьектов объединены в группы (см. рисунок справа)

Создание проекта

1. Для создания нового игрового проекта необходимо запустить редактор сцен SceneEditor.
2. В верхнем меню Проект выбрать Новый (т.е. создать новый проект).
3. В появившемся окне указываем имя проекта и имя базы ресурсов.Выбираем папку для сохранения проекта
4. В этом окне выбираем устройство для которого создаётся проект, а затем выбираем тип магазина и вариант версии игры

5. В редакторе сцен в меню Проект → Сохранить → проект с именем Learning.
Эту методику действий можно брать за шаблон для создания других проектов.
Результат: Создана база ресурсов и проект для выполнения Уроков.

Важное замечание по созданию проекта

Предположим нам необходимо создать игру для магазина А и магазина Б. Игра будет отличаться только 10 функциями. Мы можем создать игру для магазина А., а потом скопировать папку с проектом, проект переименовать, внести изменения и получить игру для магазина Б. Результат: 2 игры и 2 папки с ресурсами. Такой подход не приветствуется.
Для уменьшения времени на создание проекта, подключение ресурсов, внесения одинаковых обьектов и удобства отслеживания багов и прочего в Редакторе Сцен существует возможность создания двух лэйаутов в одном проекте. При создании проекта мы выбираем оба магазина, после чего в панели Лэйаут появится два лэйаута для магазина А и магазина Б(см. рисунок справа. При этом текстовая база проекта и база ресурсов у них будут идентичны. При создании новых объектов в одном лэйауте они же будут создаваться и в другом, при этом можно изменять свойства обьекта каждого лэйаута независимо от второго.

Экспорт проекта

Этапы экспорта проекта

• Выполняется сжатие графики при необходимости
• Очистка базы ресурсов от неиспользуемой графики
• Запаковка графики в текстуры и контейнер
  

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

Процедура экспорта проекта вызывается через меню редактора Проект - Экспортировать проекта

Параметры экспорта проекта:
Настройки параметров графики

• Ось Х, ось У — параметры сжатия графики по оси Х,У. Значения параметра от 0 до 1. При
• При выполнении сжатия рекомендуется обращать внимания на размер лэйаута
• Сжатие графики возможно и непропорциональное . Используется редко

Параметры запаковки графики

• Packege Type - упаковка ресурсов в фаил с типом DAT. Обеспечиваем защиту ресурсов проекта от несанкционированного доступа. Увеличиваем производительность при операциях чтения файлов ресурсов с твердотельного носителя.
• Texture Type - упаковка графических файлов в текстуры. Необходимо для уменьшения используемого объема оперативной памяти.

Тип экспорта

• One project file - формируется один XML файл описывающий проект.
• Split project on screens, load partly' - проект будет разбит на отдельные файлы описывающие экраны, загружаться файлы будут в порядке использования (вызова) в проекте. В результате получаем увеличение начальной загрузки проекта и использование меньшего объема оперативной памяти.

Export to folder - Путь для экспорта.Если указан путь экспорта проекта, то не учитывается выбранная ниже платформа. Если не указан - проект экспортируеются под выбраную платформу Структура папки:
Select platform - необходимо выбрать платформу для которой будем собирать проект. При экспорте на все платформы необходимо установить Marmalade SDK см. инструкцию при этом не нужно указывать путь для экспорта (оставить поле пустым). В результате запустится скрипт сборки исполняемого пакета, это будет видно по черным экранам с ходом выполнения процесса сборки.Процесс экспорта будет отображаться в окне.

Редактор ресурсов

Общее описание

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

Ресурсы проекта могут быть внесены и модифицированы только через Редактор ресурсов.
Как и в редакторе сцен, вверху окна редактора ресурсов расположено меню и кнопки быстрого доступа: создать базу ресурсов, открыть уже существующую, добавить картинку (png, jpeg), анимацию, мелодию (mp3, ogg), видео (mp4).
Ниже, в левой панели находятся папки, внутри которых можно найти различные графические ресурсы:

• Если в дереве папок активна данная папка, то на правой панели мы видим список графических ресурсов в виде иконок.
• Если же в дереве кликнуть на имя конкретной картинки, то в правой панели она будет представлена в натуральную величину.
• При клике на ресурс в левой нижней части окна редактора ресурсов появится панель с настройками ресурса в зависимости от его типа

Меню Редактора ресурсов

Некоторые инструменты также вызываются горячими клавишами (комбинация клавиш приведена в скобках )

Меню File

• New Project (Ctrl+N) – создать новый проект с новой базай ресурсов. Возможно в качестве базы ресурсов выбрать уже существующий каталог ресурсов.
• Open Project (Ctrl+N) - открыть базу ресурсов ранее созданного проекта
• Создать проект по папке — создать базу ресурсов по каталогу с ресурсами

Меню View

• Always on top - всегда отображать Редактор Ресурсов поверх всех окон
• Image Viewer - отобразить панель Image Viewer для просмотра ресурсов

Меню Project

• Add Root Base - создать еще одну базу ресурсов в текущем проекте
• Add images — добавить изображения в проект
• Add Animations — добавить анимацию в проект
• Add Sounds - добавить звук в проект
• AddVideos - добавить видео в проект
• Delete Resource — удалить ресурс
• Options — вызов окна настройки отображения изображений в редакторе
• Обрезать images в старом проекте — вызов функции удаления бордера изображения (у всех ресурсов) на указанную величину в параметре Transparent Border Size вкладки Cropping Settings из Options меню Project
  

Кнопки Add images, Add Animations, Add Sounds , AddVideos, Delete Resource вызвается по клику правой кнопки мыши в дереве базы ресурсов

Область визуализации ресурсов Image Viewer

В данной области визуализируется ресурс. Все виды ресурсов визуализируется как изображение. По клику правой кнопкой мыши внутри области визуализации выпадает меню:
Center image by Предположим мы изменили точку пивота ресурса.

• Если выберем Image Center to Center, то в центре Image Viewer отобразится ресурс.
• Если выберем Image Pivot to Center, то в центре Image Viewer отобразится точка пивота. (См. рисунок справа)
  

Directory View Mode — . Если мы выберем режим Full Source Image , то мы будем видеть изображение и бордер, а если Cropped Images — то только изображение без бордера

Shape

Для работы с обьектами физического мира иногда требуется создать дополнительный конутр вокруг обьекта. Физ_объектами могут быть не только прямоугольники. Шейп (Shape) можно задавать полигоном и кругом в Shape editor. Количество вершин в полигоне должно быть от 3 до 8. Создавать новую шейп-фигуру можно несколькими полигонами. Для удаления нарисованного шейпа нажимаем Delete

Создание базы графических ресурсов

1. Запустить редактор ресурсов ResourcesEditor.exe. В меню File выбрать New Project.
2. В окне базы создания ресурсов в строке "Папка проекта" указать путь на ранее созданную пустую папку Resources, затем в строке "Имя базы ресурсов" вписать имя корневой базы Learning_Base.

3. В корневой базе создать папку Create New Folder (например, папка Lesson_01).
4.Загрузить исходники графики из папки Sources → Lesson_01.

В папке ресурсов Resources автоматически создается папка с корневой базой (в нашем случае Learning_Base), в которой автоматически появляются папка с графическими ресурсами Lesson_01 (для урока 1) и файл Learning_Base.sirx

Внимание! Прямое изменение структуры файлов в папке Resources запрещено. Допускается работа только через редактор ресурсов.

Автоматическое создание базы

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

Действия с ресурсами в Resources Editor

Общие свойства и действия с ресурсами

После любых действий в редакторе ресурсов необходимо обновить базу ресурсов в Редакторе сцен!

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

Графические ресурсы

В редактор ресурсов подгружаются графические форматы:

• JPEG - изображение, не имеющее прозрачности. Может использоваться для "облегчения веса", в качестве фонового изображения или для паззла;
• PNG - может поддерживать прозрачность, произвольные границы изображения. Сохраняет высокое качество изображения.

Cоздание бордера изображения

Для уменьшения вероятности появления графических артефатов вокруг изображений рекомендуется создавать прозрачную область вокруг изображения. Размеры бордера задаются в пикселях.
Для создания прозрачной области кликаем по изображению и меняем параметр BorderSize на панели настройки ресурса(см. рисунок справа)
Для создания бордеров у всех ресурсов выбираем меню Projects – Options и на вкладке Cropping Settings параметру Transparent Border Size присваиваем нужное значение.

Точка пивота

Иногда возникает необходимость сместить точку вращения обьекта вокруг своей оси (точку пивота).
Для этого в редакторе ресурсов выбирем редактируемый обьект и в панели настроек ресурса изменим значения параметров Pivot.
Если мы хотим произвольно задать координаты точки пивота, то ставим галочку Edit Pivot и после этого «таскаем» редактируемый ресурс по области визуализации ресурсов. Точка пивота находится в центре экрана (красный крестик)

Заменить изображение, существующие в базе ресурсов

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

Настройки текстур

параметр texture mode определяет принадлежность картинки к текстуре.

• Если стоит -1, то картинка которая используется только на одном экране вместе с такими же картинками(которые используются только на том же экране что и выбранная) на этом экране будут упакованы в текстуру, если все картинки не поместятся в текстуру размером 1024х1024, то те картинки, которые не поместились попадут в 2-й файл текстуры.
• Если картинка используется на нескольких экранах, то в текстуру она не попадёт.
• Если стоит 1, 2, 3 и т.д до 100, то данная картинка объединится в текстуру вместе с картинками у которых стоит такое же значение в texture mode. Если все не поместятся в одну текстуру размером 1024х1024, то не поместившиеся изображения попадут в 2-ю текстуру и т.д..

Анимация

Анимация создается путем вызова кнопки add_animations и выбором нескольких графических файлов из любой папки

После загрузки анимации можно изменить ее параметры. Например, изменить скорость анимации (смены кадров) и зациклить, поставив галочку напротив Looped.
В левой части нижнего окна анимации находится список загруженных изображений, в правой - последовательность изображений (кадров), которые можно менять местами, добавлять/удалять, загружать в прямом/обратном порядке. Таким образом, можно "уменьшить вес" анимации за счет использования меньшего количества исходных изображений.

Звуковые файлы

Звуковые файлы нам нужны для озвучки персонажей и не только. Используются файлы в форматах:

• mp3 - используется как ресурс для длинного звука mus. Звуки такого формата могут воспроизводиться только последовательно.
• ogg - используется как ресурс для короткого звука snd (snd-звуки могут воспроизводиться параллельно) и для подключения голоса voice (если voice подключен к тексту, то воспроизводится последовательно). Имеет меньший объем, чем формат mp3.

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

Редактор текстов

Text Editor - хранилище всех текстовых ресурсов (надписей) на различных языках. Аналогично графике и звукам при помощи мышки они перетаскиваются в соответствующие свойства объектов, находящихся в Scene Editor.
Окно редактора имеет следующий вид:

Общие свойства и действия с текстом

После любых действий в текстовом редакторе необходимо обновить текстовую базу в Редакторе сцен!

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

Кнопки быстрого запуска

Вверху окна приложения расположены кнопки общего меню:

• — команда создать Новый файл;
• — команда открыть уже созданный проект;
• — сохранить изменения в файле;
• — создать новую папку в корневой базе;
• — добавить новую текстовую запись;
• — удалить текстовую запись.

Меню редактора

1. Если нажать в меню кнопку File, выпадет список команд, с помощью которых можно создать новый или загрузить уже созданный файл, сохранить файл с указанием места сохранения и т.д.
2.Для импорта фраз на другом языке необходимо воспользоваться Функцией Ипортировать меню File и выбрать .xml-файл с текстом и выбрать язык
3. Если нажать в меню кнопку Resource, выпадет список команд:

• Open Resource - позволяет создать базу по ранее подготовленной графической базе ресурсов с точным совпадением структуры и названием папок и файлов. Используется для Hidden Objects;
• Choose Resource File - позволяет подгрузить базу графических ресурсов для перетаскивания изображений из ResourcesEditor на иконку;
• Choose Categories Config - помогает классифицировать текстовые файлы по категориям.

Создание и заполнение текстовой базы проекта

Текстовая база не создается автоматически при создании проекта.
Для создания и заполнения текстовой базы:
1. Заходите в пункт меню file -> New. Появляется пустая база ресурсов, по умолчанию названная Untitled.
2. Слева в дереве текстовых объектов кликаем правой кнопкой мыши и выбираем Add record. Каждый раз при добавлении новой текстовой записи редактор просит нас написать ее имя. Это имя можно будет изменить в любой момент. Запишем имя arrow_If_down.
3. Выделить запись и в окне приложения TextEditor справа в столбце Word запишем слово, в столбце Sentence1,Sentence2 - указать подсказку для текстовой записи, в столбце voice - подключить звуковой файл для текстовой записи из ResourcesEditor.

Необходимо обязательно сохранять любые изменения с текстом в редакторе TextEditor.
Для вызова текстового редактора можно воспользоваться меню Tools -> Text Editor, либо кнопкой быстрого запуска .