https://wiki.appsalutecreator.com/api.php?action=feedcontributions&user=Apolozova&feedformat=atomwiki.appsalutecreator.com - Вклад участника [ru]2024-03-28T23:10:32ZВклад участникаMediaWiki 1.31.15https://wiki.appsalutecreator.com/index.php?title=%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5_%D0%B8%D0%B3%D1%80%D1%8B_%C2%ABHidden_Object_Game%C2%BB&diff=9865Создание игры «Hidden Object Game»2019-08-29T11:07:57Z<p>Apolozova: /* Детальная настройка объектов */</p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Редактор текстовых ресурсов|Урок 6]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Настройка миниигр|Урок 8]]<br />
|}<br />
----<br />
{{TOC right}}<br />
<br />
'''Цель:''' Изучить настройки объектов [[HiddenList]], [[HiddenObject]] и [[Table]] для типа механики Hidden Object Game на базе создания уровня из игры Travel.<br />
<br />
'''Задача:''' Создать уровень игры содержащей 10 поисковых объектов расположенных на одном бэкграунде (фоне). При инициализации сцены обеспечить размещение 5 объектов для поиска. <br />
<br />
== Создание экрана и сцены в игровом проекте ==<br />
<br />
Откроем проект lessons. Создадим экран Lesson_7. [[Файл:Lesson7_textbase.png|right]]<br />
В экране Lesson_7 создадим новую сцену* stg_7 с разрешением 960*640 (по умолчанию), в которую (через ResourcesEditor) добавим графические ресурсы из папки Lesson_7. (см. подготовка к работе [[Создание проекта]])<br />
<br />
* Для корректной работы на мобильном устройстве необходимо настроить параметр.<br />
<br />
* Графические объекты должны разместиться точно на местах предназначенных для их «Прятанья».<br />
<br />
Создадим папку Lesson_7 в базе текстовых описаний с помощью TextEditor. Добавим в неё 10 текстовых записей, соответствующих именам поисковых объектов. Заполним для каждой текстовой записи значение [[Интерфейс TextEditor#Создание и заполнение текстовой базы проекта | Word]], [[Интерфейс TextEditor#Создание и заполнение текстовой базы проекта | Sentence-En]], добавим графическое отображение поискового объекта. Сделать это можно вручную, перетащив картинку соответствующего объекта из редактора ресурсов и, по нажатию на картинке правой кнопкой мыши, выберем тип "icon1". Или же более быстрым [[Интерфейс TextEditor#Добавление иконок в текстовый элемент | способом]].<br />
<br />
== Общая настройка объектов ==<br />
<br />
1. Для всех поисковых графических объектов изменить тип с image на [[HiddenObject]].<br />
<br />
[[Файл:Lesson7_hidden_obj.png]]<br />
<br />
2. Создать специальные объекты [[Table]] и [[HiddenList]]. Для этого необходимо перенести графическое изображение table с последующим изменением типа с image на Table. Название объекта изменить на HOT**<br />
<br />
[[Файл:07 5.png]]<br />
<br />
3. Для объекта HiddenList перенести любое графическое изображение с последующим изменением типа с image на HiddenList и удалением графического ресурса из поля настроек (res)*. Для данного типа объекта не требуется графический ресурс. Название объекта изменить на HOL**<br />
<br />
[[Файл:Lesson7_HiddenList.png]]<br />
<br />
<br />
'''**''' Имена для специальных объектов могут использоваться любые.<br />
<br />
== Детальная настройка объектов ==<br />
<br />
'''1. Описание HiddenObject.'''<br />
<br />
''HiddenObject'' - это поисковый объект, взаимодействующий со списком HiddenList. Каждому поисковому объекту необходимо указать графический ресурс (картинку), идентификатор объекта HiddenList и идентификатор текстового ресурса (строки описания) в HiddenList.[[Файл:07 7.png|right]]<br />
<br />
Необходимо выбрать используемый объект с именем HOL (тип HiddenObjectList) в поле list.<br />
<br />
<br />
''текстID'' – название хидден-объекта, которое будет отображаться в списке. Перетаскивается мышкой из текстового редактора;<br />
<br />
''текст'' – обычный текст (будет отображаться в таблице при отсутствии ТекстID, для быстрых экспериментов);<br />
<br />
''list'' – ссылка на HiddenList, к которому будет подключен объект, для обеспечения связи между ними;<br />
<br />
''flyer'' – объект типа flyer, который запустится в работу при нахождении поискового объекта. Неудачный клик обрабатывает HiddenList. Если параметр не задан, используется fly_ok объекта HiddenList.(objid);<br />
<br />
''actor'' – объект, который отображает анимацию спрятанного объекта после удачного клика на него (обычно это машина состояния). Парметр необязателен. Актёры нужны тогда, когда отличается графика объекта, который непосредственно находится на сцене и который летит к таблице. Это может быть случай, когда на сцене лежит часть объекта, а летит целый. Или же на сцене - с тенью, а летит - без.<br />
<br />
''тип'' – номер типа объекта, используется для логического разделения объектов при обработке HiddenList.<br />
<br />
<br />
<br />
<br />
'''2. Описание HiddenObjectList.'''<br />
<br />
HiddenList - это список поисковых объектов (Hidden), которые надо найти в хидден-сцене. [[Файл:07 8.png|right]] Каждый поисковый объект на сцене связывают со списком. Объектов может быть больше, чем будет показано в данной игровой сессии (поле "объектов"). В этом случае они выбираются случайным образом. Запоминаются те из них, по которым произошёл клик (увеличивается счетчик их кликов). При следующем заходе на сцену, поисковые слова сортируются по возрастанию числа кликов и снова активизируется количество спрятанных объектов, указанных в поле "количество".<br />
<br />
HiddenList определяет основные параметры для настройки HiddenObject (скорость полета и т.п.). В дальнейшем, при необходимости, эти же параметры можно добавить в HiddenObject, чтобы для данного объекта они "перебивали" общие значения для всех.<br />
<br />
<br />
Подготовка спрятанных объектов: <br />
<br />
''num'' (поле "объектов") – максимальное количество объектов, участвующие в поиске. (int)<br />
<br />
''hide'' (поле "прятать") – если 1, то делать невидимыми объекты, не участвующие в поиске. (int) <br />
<br />
Визуальные параметры списка: <br />
<br />
''table'' (поле "таблица") – идентификатор объекта Table. (objid)<br />
<br />
''kind'' (внешний вид - поле "тип списка") – тип отображения объекта в списке (0-слово,1-ассоциация, 2-иконка, 3-иконка). (int)<br />
<br />
''cross'' (внешний вид - поле "вычеркнуть") – зачеркивать найденный элемент списка. Eсли 0 (по умолчанию), то найденный элемент удаляется, иначе "зачеркивается".(int).<br />
<br />
<br />
<br />
3. Описание Table<br />
<br />
<br />
[[Файл:Table lesson7.png]]<br />
<br />
Хотелось бы напомнить , что вы можете “поиграться” с вкладкой “таблица”, чтобы настроить внешний вид , вспомогательную область для поиска предметов.<br />
<br />
6. Параметры, общие для всех спрятанных объектов:<br />
<br />
''die'' – тип исчезания при удачном клике на объект (если нет актера) (int): <br />
<br />
0: просто исчезает;<br />
<br />
1: летит к пункту с описанием в списке HiddenList;<br />
<br />
2: улетает в случайном направлении;<br />
<br />
3: улетает к заданным координатам (fx, fy).<br />
<br />
vm - скорость движения при полете к списку предметов после клика в px/sec (float) <br />
<br />
vr - скорость вращения при полете к списку предметов после клик в град/sec (float) <br />
<br />
fw - финальная ширина к которой надо уменьшится при подлете к финальной точке (int) <br />
<br />
fh - финальная высота к которой надо уменьшится при подлете к финальной точке (int). Объект не должен изменять своих пропорций, поэтому fw или fh (или оба) всегда отрицательны. <br />
<br />
fx - финальная координата x, к которой объект должен перелететь, при удачном клике (см. тип исчезания). (int) <br />
<br />
fy - финальная координата x, к которой объект должен перелететь, при удачном клике (см. тип исчезания). (int)<br />
<br />
<br />
<blockquote><br />
[[файл:wrong.png|right|32px]]<br />
'''Внимание!''' HiddenList не будет работать без объекта [[Редактор текстовых ресурсов#Упражнения|Options]], который вы должны были создать в предыдущем уроке, а так же без параметра ''id игры'' (Очковая система -> id игры; для теста заполним его любой строкой).<br />
</blockquote><br />
<br />
== Упражнения ==<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_7, создать новый экран Lesson_7_1.<br />
<br />
2. Создать новую сцену (с названием stg_7_1).<br />
<br />
3. Скопировать все объекты из сцены stg_7 (экрана Lesson_7).<br />
<br />
4. Вставить скопированые объекты в новую сцену stg_7_1.<br />
<br />
[[Файл:07 11.png]]<br />
<br />
5. В новой сцене:<br />
<br />
a) добавить еще 3 графических ресурса и перевести в тип HiddenObject;<br />
<br />
b) разместить на местах предназначенных для их «Прятанья»;<br />
<br />
c) добавить текстовое описание в TextEditor;<br />
<br />
e) установить время игры 20 секунд, паузу 2 секунды с переходом на экран Lesson_7_1.<br />
<br />
6. Модифицировать экран Lesson_7 в полноценный уровень с выводом количества очков, игрой на время и графикой.<br />
<br />
== Упражнение № 6 ==<br />
Экран lesson_7 необходимо модифицировать в полноценный уровень.<br />
<br />
Для этого первый экран дополняем 2 счетчиками ([[counter]]), таймером ([[timer]]), машиной-блокатором ([[machine]]), машиной-комбо3 ([[machine]]) и прогрессом ([[progress]]). Второй экран с выводом очков составим позже.<br />
<br />
[[Файл:1.png]] <br />
<br />
Счетчик «amt» ([[counter]]) показывает сколько объектов найдено. Счетчик «score_H» ([[counter]]) насчитывает баллы за собранные объекты. Таймер ([[timer]]) запускается при старте игры и отсчитывает заданное время на игру, машина-блокатор «ban_H» блокирует сцену при серии ошибочных кликов. Прогресс «progr» ([[progress]]) отображает уровень прохождения игры.<br />
<br />
Чтобы всё заработало необходимо указать счетчики, таймер, машину-блокатор, машину-комбо3 и прогресс в хиденлисте «HL_01» ([[hiddenList]]).<br />
<br />
== СЧЕТЧИК ==<br />
<br />
В редакторе ресурсов выбираем анимацию и добавляем графику для счетчика. <br />
<br />
<blockquote><br />
[[файл:wrong.png|right|32px]]<br />
'''Внимание!''' Если в редакторе ресурсов нету анимации, то [[Интерфейс_ResourceEditor#Анимация|создайте]] её - это просто). Анимация создается с названием папки, в которой хранились картинки, избегайте кириллицы в названии папок.<br />
</blockquote><br />
<br />
[[Файл:Coun (5).png]] [[Файл:Coun (6).png]] [[Файл:Coun (7).png]] [[Файл:Coun (8).png]] [[Файл:Coun (9).png]] [[Файл:Coun_(10).png]] [[Файл:Coun (11).png]] [[Файл:Coun (1).png]] [[Файл:Coun (2).png]] [[Файл:Coun (3).png]] [[Файл:Coun (4).png]]<br />
<br />
Создаем объект сцены с типом «[[counter]]», в поле res перетаскиваем анимацию с цифрами от 0 до 9, разделитель перетаскиваем в отдельную графу без анимации. Настройки для счетчика:<br />
<br />
[[Файл:243.png]] [[Файл:33.png]]<br />
<br />
== ТАЙМЕР ==<br />
<br />
В свойствах таймера «[[timer]]» необходимо указать «значение» с которого начнется отсчет времени (18000 = 18 сек.). <br />
В свойство «графика» из графического редактора перетаскиваем анимацию которую делали для счетчика и двоеточие. Настройки для таймера:<br />
<br />
[[Файл:444.png]]<br />
<br />
Также стоит обновить настройки , в HiddenObjectList , т.к. если мы его не укажем отсчет времени просто не начнется , и так же нужно помнить чтобы время таймера и время указанное в HiddenObjectList должны совпадать , иначе отсчет будет идти от меньшего времени вне зависимости указано оно в HOL или в таймере<br />
[[Файл:HOL_time.png]]<br />
<br />
<br />
== ПРОГРЕСС ==<br />
<br />
[[Progress]] используют для отображения каких либо ачивментов, например когда игрок проходит уровень он может получить 1,2,3 звезды или бронзовую, серебряную, золотую. <br />
Настройки для прогресса : <br />
<br />
[[Файл:555.png]]<br />
<br />
Графика для Progress: [[Файл:666.png]]<br />
<br />
Настройки для машины-Combo3c :<br />
<br />
[[Файл:777.png]]<br />
<br />
Во всех HiddenObject добавить свойство "изменить состояние объекта" combo3c [[Файл:1818.png]]<br />
<br />
Настройки для машины-блокатора «ban_H» (machine) :<br />
<br />
[[Файл:Ban h na max.png]]<br />
[[Файл:9.png]]<br />
<br />
Настройки для hiddenList:<br />
<br />
[[Файл:1010.png]] [[Файл:1011.png]]<br />
<br />
Группа - звезды combo num =1 Количество быстро найденных объектов, нужное для получения звезды Combo combo time = 3000 Интервал между кликами, считающимися быстрыми для Combo accuracy = 0,85 Точность кликов для получения звезды Accuracy (1 = 100%, все клики должны быть только удачные) лимит ложных кликов =5 Лимит ложных кликов. Формула расчета количество верных кликов делим на общее количество получаем коэффициент если он равен или больше указного нами то в опции пишем параметр, если нет то не пишем.<br />
<br />
<br />
Для HiddenList и Counter пункт "сохранить в профиль" должен совпадать. Если в HiddenList указано "глобально", то и в Counter также необходимо установить "глобально".<br />
<br />
<br />
Создаем вторую сцену на которой формируем окно вывода результатов из ректангла (Rectangle), текстовых объектов и счетчиков, окно<br />
должно открываться по окончанию игры, при выигрыше показывать набранные очки и надпись об удаче,при проигрыше нулевые очки и надпись о неудаче.<br />
<br />
Графика для Rectangle rec: [[Файл:0001.png]] [[Файл:0002.png]] [[Файл:0003.png]] [[Файл:0004.png]] [[Файл:0005.png]] [[Файл:0006.png]] [[Файл:0007.png]] [[Файл:0008.png]] [[Файл:0009.png]] [[Файл:00010.png]] <br />
<br />
<blockquote><br />
[[файл:wrong.png|right|32px]]<br />
'''Внимание!''' Rectangle black (Цвет задается в свойстве фон->цвет заливки) используется в качестве фона, на котором будет размещаться всплывающие окно с показаниями результата пройденной игры. <br />
</blockquote><br />
<br />
[[Файл:1012.png]] [[Файл:0102.png]] <br />
<br />
<br />
Далее копируем Rectangle black и делаем подобъектом блокатора ban_H, а также меняем размеры rectangle black (устанавливаем не нулевые!).<br />
<br />
Создадим еще 5 счетчиков. Они нам понадобятся в конце игры для выведения бонусного счета.<br />
<br />
В свойствах счетчиков необходимо прописать уровень!<br />
<br />
1) счетчик 7_4_1 — игровые очки;<br />
<br />
уровень: last_game.score30_total<br />
<br />
2) счетчик 7_4_2 — бонус за время;<br />
<br />
уровень: last_game.score30_time<br />
<br />
3) счетчик 7_4_3 — бонус за аккуратность;<br />
<br />
уровень: last_game.score30_accuracy<br />
<br />
4) счетчик 7_4_4 — бонус за комбо;<br />
<br />
уровень: last_game.ecmbRowMax<br />
<br />
5) счетчик 7_4_5 — очки за уровень;<br />
<br />
уровень: last_game.score30_level<br />
<br />
Важный аспект:После того как вы добавили last.game.xxx в графу уровень в каждом счетчике , графа игра должна остаться пустой и так же не стоит эти счетчики закидывать в HOL , т.к. одни и те же данные могут конфликтовать между собой. Также обязательным условием является включение графы “очки 3.0” в HOL`e.<br />
<br />
После создания счетчиков и установки уровней добавляем 5 текстовых объектов, которые описывают значения, выводящиеся счетчиками в конце игры в окне результатов (игровые очки, бонус за время и т.д.).<br />
<br />
<br />
Настройки для машины — star1 <br />
(проверка в опциях параметра last_game.last_star_accuracy0, <br />
last_game.last_star_time0, )<br />
<br />
[[Файл:0303.png]]<br />
<br />
Настройки для машины — star2 <br />
(если параметр accuracy=0)<br />
<br />
[[Файл:0304.png]]<br />
<br />
Настройки для машины — star3 <br />
(если игра пройдена за указанное время)<br />
<br />
[[Файл:0305.png]]<br />
<br />
Настройки для машины — win<br />
<br />
[[Файл:0306.png]]<br />
<br />
<br />
Машина win считывает «read» показания счетчика и запускает star1 если игра пройдена.<br />
<br />
Также создаем кнопку close (button), которая должна закрывать окно результатов. Добавляем "изменить состояние объекта"; объект win, состояние close. <br />
<br />
Включаем вьювер и наблюдаем как автоматически включается таймер, за каждый собранный предмет вам начисляются очки, прогресс показывает прохождение игры, в конце игры появляется окно с выводом результатов набранных очков с звездами.<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
----<br />
<br />
{| width="100%" <br />
| width="40%"|[[Редактор текстовых ресурсов|Урок 6]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Настройка миниигр|Урок 8]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5_%D0%B8%D0%B3%D1%80%D1%8B_%C2%ABHidden_Object_Game%C2%BB&diff=9864Создание игры «Hidden Object Game»2019-08-29T11:06:53Z<p>Apolozova: /* Детальная настройка объектов */</p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Редактор текстовых ресурсов|Урок 6]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Настройка миниигр|Урок 8]]<br />
|}<br />
----<br />
{{TOC right}}<br />
<br />
'''Цель:''' Изучить настройки объектов [[HiddenList]], [[HiddenObject]] и [[Table]] для типа механики Hidden Object Game на базе создания уровня из игры Travel.<br />
<br />
'''Задача:''' Создать уровень игры содержащей 10 поисковых объектов расположенных на одном бэкграунде (фоне). При инициализации сцены обеспечить размещение 5 объектов для поиска. <br />
<br />
== Создание экрана и сцены в игровом проекте ==<br />
<br />
Откроем проект lessons. Создадим экран Lesson_7. [[Файл:Lesson7_textbase.png|right]]<br />
В экране Lesson_7 создадим новую сцену* stg_7 с разрешением 960*640 (по умолчанию), в которую (через ResourcesEditor) добавим графические ресурсы из папки Lesson_7. (см. подготовка к работе [[Создание проекта]])<br />
<br />
* Для корректной работы на мобильном устройстве необходимо настроить параметр.<br />
<br />
* Графические объекты должны разместиться точно на местах предназначенных для их «Прятанья».<br />
<br />
Создадим папку Lesson_7 в базе текстовых описаний с помощью TextEditor. Добавим в неё 10 текстовых записей, соответствующих именам поисковых объектов. Заполним для каждой текстовой записи значение [[Интерфейс TextEditor#Создание и заполнение текстовой базы проекта | Word]], [[Интерфейс TextEditor#Создание и заполнение текстовой базы проекта | Sentence-En]], добавим графическое отображение поискового объекта. Сделать это можно вручную, перетащив картинку соответствующего объекта из редактора ресурсов и, по нажатию на картинке правой кнопкой мыши, выберем тип "icon1". Или же более быстрым [[Интерфейс TextEditor#Добавление иконок в текстовый элемент | способом]].<br />
<br />
== Общая настройка объектов ==<br />
<br />
1. Для всех поисковых графических объектов изменить тип с image на [[HiddenObject]].<br />
<br />
[[Файл:Lesson7_hidden_obj.png]]<br />
<br />
2. Создать специальные объекты [[Table]] и [[HiddenList]]. Для этого необходимо перенести графическое изображение table с последующим изменением типа с image на Table. Название объекта изменить на HOT**<br />
<br />
[[Файл:07 5.png]]<br />
<br />
3. Для объекта HiddenList перенести любое графическое изображение с последующим изменением типа с image на HiddenList и удалением графического ресурса из поля настроек (res)*. Для данного типа объекта не требуется графический ресурс. Название объекта изменить на HOL**<br />
<br />
[[Файл:Lesson7_HiddenList.png]]<br />
<br />
<br />
'''**''' Имена для специальных объектов могут использоваться любые.<br />
<br />
== Детальная настройка объектов ==<br />
<br />
'''1. Описание HiddenObject.'''<br />
<br />
''HiddenObject'' - это поисковый объект, взаимодействующий со списком HiddenList. Каждому поисковому объекту необходимо указать графический ресурс (картинку), идентификатор объекта HiddenList и идентификатор текстового ресурса (строки описания) в HiddenList.[[Файл:07 7.png|right]]<br />
<br />
Необходимо выбрать используемый объект с именем HOL (тип HiddenObjectList) в поле list.<br />
<br />
<br />
''текстID'' – название хидден-объекта, которое будет отображаться в списке. Перетаскивается мышкой из текстового редактора;<br />
<br />
''текст'' – обычный текст (будет отображаться в таблице при отсутствии ТекстID, для быстрых экспериментов);<br />
<br />
''list'' – ссылка на HiddenList, к которому будет подключен объект, для обеспечения связи между ними;<br />
<br />
''flyer'' – объект типа flyer, который запустится в работу при нахождении поискового объекта. Неудачный клик обрабатывает HiddenList. Если параметр не задан, используется fly_ok объекта HiddenList.(objid);<br />
<br />
''actor'' – объект, который отображает анимацию спрятанного объекта после удачного клика на него (обычно это машина состояния). Парметр необязателен. Актёры нужны тогда, когда отличается графика объекта, который непосредственно находится на сцене и который летит к таблице. Это может быть случай, когда на сцене лежит часть объекта, а летит целый. Или же на сцене - с тенью, а летит - без.<br />
<br />
''тип'' – номер типа объекта, используется для логического разделения объектов при обработке HiddenList.<br />
<br />
<br />
<br />
<br />
'''2. Описание HiddenObjectList.'''<br />
<br />
HiddenList - это список поисковых объектов (Hidden), которые надо найти в хидден-сцене. [[Файл:07 8.png|right]] Каждый поисковый объект на сцене связывают со списком. Объектов может быть больше, чем будет показано в данной игровой сессии (поле "объектов"). В этом случае они выбираются случайным образом. Запоминаются те из них, по которым произошёл клик (увеличивается счетчик их кликов). При следующем заходе на сцену, поисковые слова сортируются по возрастанию числа кликов и снова активизируется количество спрятанных объектов, указанных в поле "количество".<br />
<br />
HiddenList определяет основные параметры для настройки HiddenObject (скорость полета и т.п.). В дальнейшем, при необходимости, эти же параметры можно добавить в HiddenObject, чтобы для данного объекта они "перебивали" общие значения для всех.<br />
<br />
<br />
Подготовка спрятанных объектов: <br />
<br />
''num'' (поле "объектов") – максимальное количество объектов, участвующие в поиске. (int)<br />
<br />
''hide'' (поле "прятать") – если 1, то делать невидимыми объекты, не участвующие в поиске. (int) <br />
<br />
Визуальные параметры списка: <br />
<br />
''table'' (поле "таблица") – идентификатор объекта Table. (objid)<br />
<br />
''kind'' (внешний вид - поле "тип списка") – тип отображения объекта в списке (0-слово,1-ассоциация, 2-иконка, 3-иконка). (int)<br />
<br />
''cross'' (внешний вид - поле "вычеркнуть") – зачеркивать найденный элемент списка. Eсли 0 (по умолчанию), то найденный элемент удаляется, иначе "зачеркивается".(int).<br />
<br />
<br />
<br />
3. Описание Table<br />
<br />
<br />
[[Файл:Table lesson7.png]]<br />
<br />
хотелось бы напомнить , что вы можете “поиграться” с вкладкой “таблица” , <br />
чтобы настроить внешний вид , вспомогательную область для поиска предметов.<br />
<br />
6. Параметры, общие для всех спрятанных объектов:<br />
<br />
''die'' – тип исчезания при удачном клике на объект (если нет актера) (int): <br />
<br />
0: просто исчезает;<br />
<br />
1: летит к пункту с описанием в списке HiddenList;<br />
<br />
2: улетает в случайном направлении;<br />
<br />
3: улетает к заданным координатам (fx, fy).<br />
<br />
vm - скорость движения при полете к списку предметов после клика в px/sec (float) <br />
<br />
vr - скорость вращения при полете к списку предметов после клик в град/sec (float) <br />
<br />
fw - финальная ширина к которой надо уменьшится при подлете к финальной точке (int) <br />
<br />
fh - финальная высота к которой надо уменьшится при подлете к финальной точке (int). Объект не должен изменять своих пропорций, поэтому fw или fh (или оба) всегда отрицательны. <br />
<br />
fx - финальная координата x, к которой объект должен перелететь, при удачном клике (см. тип исчезания). (int) <br />
<br />
fy - финальная координата x, к которой объект должен перелететь, при удачном клике (см. тип исчезания). (int)<br />
<br />
<br />
<blockquote><br />
[[файл:wrong.png|right|32px]]<br />
'''Внимание!''' HiddenList не будет работать без объекта [[Редактор текстовых ресурсов#Упражнения|Options]], который вы должны были создать в предыдущем уроке, а так же без параметра ''id игры'' (Очковая система -> id игры; для теста заполним его любой строкой).<br />
</blockquote><br />
<br />
== Упражнения ==<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_7, создать новый экран Lesson_7_1.<br />
<br />
2. Создать новую сцену (с названием stg_7_1).<br />
<br />
3. Скопировать все объекты из сцены stg_7 (экрана Lesson_7).<br />
<br />
4. Вставить скопированые объекты в новую сцену stg_7_1.<br />
<br />
[[Файл:07 11.png]]<br />
<br />
5. В новой сцене:<br />
<br />
a) добавить еще 3 графических ресурса и перевести в тип HiddenObject;<br />
<br />
b) разместить на местах предназначенных для их «Прятанья»;<br />
<br />
c) добавить текстовое описание в TextEditor;<br />
<br />
e) установить время игры 20 секунд, паузу 2 секунды с переходом на экран Lesson_7_1.<br />
<br />
6. Модифицировать экран Lesson_7 в полноценный уровень с выводом количества очков, игрой на время и графикой.<br />
<br />
== Упражнение № 6 ==<br />
Экран lesson_7 необходимо модифицировать в полноценный уровень.<br />
<br />
Для этого первый экран дополняем 2 счетчиками ([[counter]]), таймером ([[timer]]), машиной-блокатором ([[machine]]), машиной-комбо3 ([[machine]]) и прогрессом ([[progress]]). Второй экран с выводом очков составим позже.<br />
<br />
[[Файл:1.png]] <br />
<br />
Счетчик «amt» ([[counter]]) показывает сколько объектов найдено. Счетчик «score_H» ([[counter]]) насчитывает баллы за собранные объекты. Таймер ([[timer]]) запускается при старте игры и отсчитывает заданное время на игру, машина-блокатор «ban_H» блокирует сцену при серии ошибочных кликов. Прогресс «progr» ([[progress]]) отображает уровень прохождения игры.<br />
<br />
Чтобы всё заработало необходимо указать счетчики, таймер, машину-блокатор, машину-комбо3 и прогресс в хиденлисте «HL_01» ([[hiddenList]]).<br />
<br />
== СЧЕТЧИК ==<br />
<br />
В редакторе ресурсов выбираем анимацию и добавляем графику для счетчика. <br />
<br />
<blockquote><br />
[[файл:wrong.png|right|32px]]<br />
'''Внимание!''' Если в редакторе ресурсов нету анимации, то [[Интерфейс_ResourceEditor#Анимация|создайте]] её - это просто). Анимация создается с названием папки, в которой хранились картинки, избегайте кириллицы в названии папок.<br />
</blockquote><br />
<br />
[[Файл:Coun (5).png]] [[Файл:Coun (6).png]] [[Файл:Coun (7).png]] [[Файл:Coun (8).png]] [[Файл:Coun (9).png]] [[Файл:Coun_(10).png]] [[Файл:Coun (11).png]] [[Файл:Coun (1).png]] [[Файл:Coun (2).png]] [[Файл:Coun (3).png]] [[Файл:Coun (4).png]]<br />
<br />
Создаем объект сцены с типом «[[counter]]», в поле res перетаскиваем анимацию с цифрами от 0 до 9, разделитель перетаскиваем в отдельную графу без анимации. Настройки для счетчика:<br />
<br />
[[Файл:243.png]] [[Файл:33.png]]<br />
<br />
== ТАЙМЕР ==<br />
<br />
В свойствах таймера «[[timer]]» необходимо указать «значение» с которого начнется отсчет времени (18000 = 18 сек.). <br />
В свойство «графика» из графического редактора перетаскиваем анимацию которую делали для счетчика и двоеточие. Настройки для таймера:<br />
<br />
[[Файл:444.png]]<br />
<br />
Также стоит обновить настройки , в HiddenObjectList , т.к. если мы его не укажем отсчет времени просто не начнется , и так же нужно помнить чтобы время таймера и время указанное в HiddenObjectList должны совпадать , иначе отсчет будет идти от меньшего времени вне зависимости указано оно в HOL или в таймере<br />
[[Файл:HOL_time.png]]<br />
<br />
<br />
== ПРОГРЕСС ==<br />
<br />
[[Progress]] используют для отображения каких либо ачивментов, например когда игрок проходит уровень он может получить 1,2,3 звезды или бронзовую, серебряную, золотую. <br />
Настройки для прогресса : <br />
<br />
[[Файл:555.png]]<br />
<br />
Графика для Progress: [[Файл:666.png]]<br />
<br />
Настройки для машины-Combo3c :<br />
<br />
[[Файл:777.png]]<br />
<br />
Во всех HiddenObject добавить свойство "изменить состояние объекта" combo3c [[Файл:1818.png]]<br />
<br />
Настройки для машины-блокатора «ban_H» (machine) :<br />
<br />
[[Файл:Ban h na max.png]]<br />
[[Файл:9.png]]<br />
<br />
Настройки для hiddenList:<br />
<br />
[[Файл:1010.png]] [[Файл:1011.png]]<br />
<br />
Группа - звезды combo num =1 Количество быстро найденных объектов, нужное для получения звезды Combo combo time = 3000 Интервал между кликами, считающимися быстрыми для Combo accuracy = 0,85 Точность кликов для получения звезды Accuracy (1 = 100%, все клики должны быть только удачные) лимит ложных кликов =5 Лимит ложных кликов. Формула расчета количество верных кликов делим на общее количество получаем коэффициент если он равен или больше указного нами то в опции пишем параметр, если нет то не пишем.<br />
<br />
<br />
Для HiddenList и Counter пункт "сохранить в профиль" должен совпадать. Если в HiddenList указано "глобально", то и в Counter также необходимо установить "глобально".<br />
<br />
<br />
Создаем вторую сцену на которой формируем окно вывода результатов из ректангла (Rectangle), текстовых объектов и счетчиков, окно<br />
должно открываться по окончанию игры, при выигрыше показывать набранные очки и надпись об удаче,при проигрыше нулевые очки и надпись о неудаче.<br />
<br />
Графика для Rectangle rec: [[Файл:0001.png]] [[Файл:0002.png]] [[Файл:0003.png]] [[Файл:0004.png]] [[Файл:0005.png]] [[Файл:0006.png]] [[Файл:0007.png]] [[Файл:0008.png]] [[Файл:0009.png]] [[Файл:00010.png]] <br />
<br />
<blockquote><br />
[[файл:wrong.png|right|32px]]<br />
'''Внимание!''' Rectangle black (Цвет задается в свойстве фон->цвет заливки) используется в качестве фона, на котором будет размещаться всплывающие окно с показаниями результата пройденной игры. <br />
</blockquote><br />
<br />
[[Файл:1012.png]] [[Файл:0102.png]] <br />
<br />
<br />
Далее копируем Rectangle black и делаем подобъектом блокатора ban_H, а также меняем размеры rectangle black (устанавливаем не нулевые!).<br />
<br />
Создадим еще 5 счетчиков. Они нам понадобятся в конце игры для выведения бонусного счета.<br />
<br />
В свойствах счетчиков необходимо прописать уровень!<br />
<br />
1) счетчик 7_4_1 — игровые очки;<br />
<br />
уровень: last_game.score30_total<br />
<br />
2) счетчик 7_4_2 — бонус за время;<br />
<br />
уровень: last_game.score30_time<br />
<br />
3) счетчик 7_4_3 — бонус за аккуратность;<br />
<br />
уровень: last_game.score30_accuracy<br />
<br />
4) счетчик 7_4_4 — бонус за комбо;<br />
<br />
уровень: last_game.ecmbRowMax<br />
<br />
5) счетчик 7_4_5 — очки за уровень;<br />
<br />
уровень: last_game.score30_level<br />
<br />
Важный аспект:После того как вы добавили last.game.xxx в графу уровень в каждом счетчике , графа игра должна остаться пустой и так же не стоит эти счетчики закидывать в HOL , т.к. одни и те же данные могут конфликтовать между собой. Также обязательным условием является включение графы “очки 3.0” в HOL`e.<br />
<br />
После создания счетчиков и установки уровней добавляем 5 текстовых объектов, которые описывают значения, выводящиеся счетчиками в конце игры в окне результатов (игровые очки, бонус за время и т.д.).<br />
<br />
<br />
Настройки для машины — star1 <br />
(проверка в опциях параметра last_game.last_star_accuracy0, <br />
last_game.last_star_time0, )<br />
<br />
[[Файл:0303.png]]<br />
<br />
Настройки для машины — star2 <br />
(если параметр accuracy=0)<br />
<br />
[[Файл:0304.png]]<br />
<br />
Настройки для машины — star3 <br />
(если игра пройдена за указанное время)<br />
<br />
[[Файл:0305.png]]<br />
<br />
Настройки для машины — win<br />
<br />
[[Файл:0306.png]]<br />
<br />
<br />
Машина win считывает «read» показания счетчика и запускает star1 если игра пройдена.<br />
<br />
Также создаем кнопку close (button), которая должна закрывать окно результатов. Добавляем "изменить состояние объекта"; объект win, состояние close. <br />
<br />
Включаем вьювер и наблюдаем как автоматически включается таймер, за каждый собранный предмет вам начисляются очки, прогресс показывает прохождение игры, в конце игры появляется окно с выводом результатов набранных очков с звездами.<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
----<br />
<br />
{| width="100%" <br />
| width="40%"|[[Редактор текстовых ресурсов|Урок 6]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Настройка миниигр|Урок 8]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=Slider&diff=9863Slider2019-08-19T14:00:53Z<p>Apolozova: /* 1. Слайдер как ползунок для регулировки громкости */</p>
<hr />
<div>{{TOC right}}<br />
'''Slider''' — встроенный [[Object|объект]] редактора, реализующий прокручивание списков, а так же даёт возможность создание различных ползунков для регулирования параметров ( к примеру регулятор громкости, музыки, яркости и т.д. ) <br />
<br />
== Общие параметры ==<br />
[[Файл:Slider.png|right]]<br />
<br />
*'''id-объекта'''( ''id'' ) - уникальный номер объекта<br />
*'''тип''' ( ''type'' ) - Выбранный тип объекта определяет его функциональное назначение и его свойства<br />
*'''имя'''( ''name'' ) - Имя графического объекта в дереве проекта. Может быть произвольным. По умолчанию соответствует имени файла из базы ресурсов.<br />
*'''синхронизация''' ( ''sync'' )- Применяется для синхронизации между лейаутами, если указан параметр ''нет'' то объект будет активен только на текущем лейауте<br />
*'''z''' - Параметр порядка рисования объекта. Сначала рисуются объекты с большим z, затем, поверх них - с меньшим.<br />
*'''память''' ( ''memo'' ) - Если 1, то при повторном открытии экрана объект не обновляет свои параметры (помнит текущие параметры, оставшиеся от предыдущего посещения экрана).<br />
*'''[[прокликиваемая]]''' ( ''passClk'' ) - Если 1, то картинка прозрачна для клика мышкой (пропускает объектам под ней). Если 2, то картинка сама обрабатывает клик, но и пропускает его дальше"<br />
== Основные параметры ==<br />
<br />
'''Группа - размер'''<br />
[[Файл:object1.png|400px|right]] <br />
*'''W''' ( ''w'' ) - Ширина графического объекта в пикселях<br />
*'''H''' ( ''h'' )- Высота графического объекта в пикселях<br />
<br />
<br />
'''Группа - модификаторы'''<br />
*'''alpha''' ( ''al'' ) - Прозрачность: от 0 (прозрачен) до 1 (не прозрачен).<br />
*'''blending''' ( ''bl'' ) - Alpha смешивание (parent - наследует alpha от родителя, blend - смешивание, add - добавление, sub - вычитание, none - ничего не происходит. (Подробнее о Alpha смешивании - здесь)).<br />
*'''angle''' ( ''ang'' ) - Угол поворота в градусах (0 - не повёрнут). Отсчитывается от оси x вниз. Вверх - идут отрицательные углы.<br />
*'''scale x''' ( ''sx'' ) - Масштаб по оси '''x''' (1 - не изменен, 1.5 - увеличен в полтора раза, и т.д.).<br />
*'''scale y''' ( ''sy'' )- Масштаб по оси '''y''' (1 - не изменен, 1.5 - увеличен в полтора раза, и т.д.).<br />
<br />
<br />
''' Группа - размер ползунка ''':<br />
*'''W''' ( ''handle_width'' ) - Ширина ползунка в пикселях.<br />
*'''H''' ( ''handle_height'' )- Высота ползунка в пикселях.<br />
<br />
<br />
'''Группа - дополнительные'''<br />
*'''значение''' ( ''value'' ) - Текущее значение ползунка слайдера.<br />
*'''шаг смещения''' ( ''shift_value'' ) - Смещение ползунка слайдера при установке состояния increase или decrease.<br />
*'''вертикальный''' ( ''vertical'' ):<br />
::'''0''' - горизонтальное размещение;<br />
::'''1''' - вертикальное размещение слайдера.<br />
*'''обратный''' ( ''reversed'' ):<br />
::'''0''' - значение увеличивается вниз или вверх;<br />
::'''1''' - значение увеличивается влево или вверх.<br />
*'''ползунок''' ( ''handle_res'' ) - Ресурс, за который пользователь будет тянуть.<br />
*'''полоса''' ( ''groove_res'' ) - Ресурс, который будет тайлиться для заполнения полосы прокрутки.<br />
*'''начальная грань''' ( ''groove_begin_res'' ) - Ресурс, картинка левой или верхней грани полосы прокрутки.<br />
*'''конечная грань''' ( ''groove_end_res'' ) - Ресурс, картинка правой или нижней грани полосы прокрутки.<br />
*'''отступ''' ( ''groove_margin'' ) - Отступ от сторон полосы, в который ползунок упрётся центром, при достижении максимального значения.<br />
*'''целевой объект''' ( ''target_object'' ) - Объект, который будет слушать изменения значения слайдера. Объект должен содержать реакцию на SAY_SCROLL.<br />
<br />
== Добавляемые параметры ==<br />
<br />
[[Файл:+.png]] '''изменилось значение: изменить параметры объекта''' ( ''value_changed_param'' ) - После изменения значения слайдера изменить параметр объекта:<br />
::'''объект''' ('' obj '') - этот объект меняет свой параметр;<br />
::'''свойство''' ('' par '') - Параметр, который мы изменяем;<br />
::'''значение''' ('' val '') - Новое значение параметра.<br />
<br />
[[Файл:+.png]] '''изменилось значение: изменить состояние объекта''' ( ''value_changed_state'' ) - После изменения значения слайдера перевести объект в новое состояние:<br />
::'''объект''' ('' obj '') - этот объект меняет свой параметр;<br />
::'''состояние''' ('' st '') - Новое состояние для объекта из предыдущего поля.<br />
<br />
[[Файл:+.png]] '''достигнут минимум: изменить состояние объекта''' ( ''min_reached_state'' ):<br />
::'''объект''' ('' obj '') - этот объект меняет свой параметр;<br />
::'''состояние''' ('' st '') - Новое состояние для объекта из предыдущего поля.<br />
<br />
[[Файл:+.png]] '''достигнут максимум: изменить состояние объекта''' ( ''max_reached_state'' ):<br />
::'''объект''' ('' obj '') - этот объект меняет свой параметр;<br />
::'''состояние''' ('' st '') - Новое состояние для объекта из предыдущего поля.<br />
<br />
[[Файл:+.png]] '''покинут минимум: изменить состояние объекта''' ( ''min_left_state'' ):<br />
::'''объект''' ('' obj '') - этот объект меняет свой параметр;<br />
::'''состояние''' ('' st '') - Новое состояние для объекта из предыдущего поля.<br />
<br />
[[Файл:+.png]] '''покинут максимум: изменить состояние объекта''' ( ''max_left_state'' ):<br />
::'''объект''' ('' obj '') - этот объект меняет свой параметр;<br />
::'''состояние''' ('' st '') - Новое состояние для объекта из предыдущего поля.<br />
<br />
== Состояния ==<br />
<br />
*'''increase''' - увеличить текущее значение слайдера на значение указанное в поле '''шаг смещения'''.<br />
*'''decrease''' - уменьшить текущее значение слайдера на значение указанное в поле '''шаг смещения'''.<br />
<br />
== Примечания ==<br />
<br />
1) Если слайдеру следующие поля не задать, то приложение зависнет:<br />
::*'''ползунок''';<br />
::*'''полоса''';<br />
::*'''начальная грань''';<br />
::*'''конечная грань'''.<br><br />
2) Если объекту слайдер не задавать объект слежения ( целевой объект ), то в поле значение ( ''value'' ) будет находиться число от 0.00 до 1.00 в зависимости от положения ползунка. Это значение считываем как строку, иначе получим или 0 или 1.<br><br />
<br />
== Примеры реализации ==<br />
<br />
==='''1. Слайдер как ползунок для регулировки громкости'''===<br />
<br />
:В проекте имеем два объекта sounds ( ''slider'' ) и save_sounds ( ''mashine'' ). <br />
<br />
[[Файл:Slider Tree.png|centre]]<br />
<br />
:Слайдер реализует прокрутку, а машина при изменении значения слайдера переводит машину в состояние save ( записываем значение слайдера в опции ).<br />
<br />
:Настройки объекта slider:<br><br />
[[Файл:Slider in option.png|centre]]<br />
<br />
<br />
:Машина ''save_sounds'':<br><br />
[[Файл:Mashine for slider in option.png|centre]]<br />
<br />
Состояния:<br><br />
::'''init''': выставляем текущее значение громкости звука объекту slider. (Почему в ините? Так как данная машина ребёнок слайдера, то проинитится машинка сразу после слайдера).<br />
::'''save''': считываем значение slider и записываем в опции.<br />
<br />
==='''2. Слайдер как скролл для прокрутки таблицы'''===<br />
<br />
:Чтобы нашим слайдером прокручивать таблицу, мы должны указать в поле '''Целевой объект''' нужную таблицу. Выбор плоскости для прокручивания ( вертикально или горизонтально), выбирается исходя из ориентации слайдера (параметр '''вертикальный'''):<br />
<br />
[[Файл:Slider table.png|centre]]<br />
<br />
[[Category:Main objects]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%9F%D0%BE%D0%B4%D0%B3%D0%BE%D1%82%D0%BE%D0%B2%D0%BA%D0%B0_%D0%B8_%D1%84%D0%BE%D1%80%D0%BC%D0%B0%D1%82%D1%8B_%D0%B3%D1%80%D0%B0%D1%84%D0%B8%D0%BA%D0%B8&diff=9862Подготовка и форматы графики2019-08-16T13:38:17Z<p>Apolozova: /* Подготовка графики */</p>
<hr />
<div>== Введение ==<br />
[[Файл:Screen1.png|300px|right]]<br />
При разработке дизайна следует учитывать, что существует множество устройств с различными характеристиками <br />
экранов. Самое сложное это подготовить один набор графики, который можно использовать на всех устройствах без дополнительной переделки. Хотя возможна подготовка и использование нескольких наборов графики, в этом случае будет автоматически выбираться лейаут наиболее близкий по размерам.<br> Это хорошо понятно на приложениях для iOS где один пакет .ipa может запускаться на iPad (1024х768) соотношение сторон 3:4 и iPhone (1136х640) 16:9.<br><br />
На изображении хорошо видно, что только центральная часть будет активна на этих устройствах, а "уши" обрежутся и не будут видны.<br />
Следовательно все активные игровые элементы должны быть расположены в активной зоне. <br><br />
.<br />
.<br />
.<br />
<br />
== Разрешения экранов и соотношение сторон ==<br />
<br />
<br />
На графике приведены основные разрешения экранов и показаны их пропорции сторон <br />
[[Файл:Video_Standards.png|500px|center|источник http://en.wikipedia.org/wiki/File:Vector_Video_Standards5.svg]]<br />
<br />
== Подготовка графики ==<br />
[[Файл:Res.png|300px|thumb|right]]<br />
Основными шагами при разработке графики для игр является:<br />
* выбрать базовое разрешение в котором художники будут формировать исходные файлы<br />
* определить активную игровую область<br />
* определить целевые устройства параметры сжатия графики для них <br />
<br />
При выборе базового разрешения необходимо учитывать что разрешения экранов постоянно растут и понимать что игра с разрешением графики 800х600 была недавно стандартом для PC, теперь можно только выкинуть.<br><br />
Распространение экранов с большой плотность пикселей и большим разрешением также необходимо брать во внимание iPad Retina 2048x1536<br />
pix, Google Nexus 10 2560х1600 pix и др.<br />
<br />
Также следует помнить об ограничениях в оперативной памяти на мобильных устройствах и объеме памяти которое занимает каждое дополнительное изображение.<br />
Так к примеру картинка размером 2560х1600 на некоторых устройствах будет занимать ~40 Mb в памяти при доступных ~ 100 Mb <br />
<br />
Итак выбираем целевое соотношение сторон для которого мы хотим разработать графику. <br><br />
Предположим 16:9, теперь необходимо определить разрешение в пикселях 2774*1536 pix<br />
<br />
Таблица с права отображает часть устройств для которых мы будем разрабатывать графику (список поддерживаемых устройств не ограничен)<br />
<br />
----<br />
<br />
[[Файл:TableGraph.png|300px|thumb|right]]<br />
<br />
Существует возможность непропорционального скалирования экранов (лейаут) для максимального использования активной области. Естественно это можно делать,есть позволяют интерфейсные элементы (нет круглых кнопок, они приварятся в овалы) <br><br />
Таблица отображает некоторые параметры которые необходимо настраивать при сборке исполняемого файла<br><br />
'''Примечпние:''' Следует знать, что к примеру, расположение интерфейсных элементов можно настраивать с помощью параметра ''align''<br />
Это означает что элемент будет находится всегда на заданном расстоянии от карая экрана<br><br />
[[Файл:Align.png|200px]]<br />
<br />
== Форматы файлов ==<br />
AppSalute Сreator использует растровую графику.<br><br />
Форматы файлов доступные для использования:<br />
* .png<br />
* .jpg - основное применение для бекграундов и изображений без альфа канала<br />
<br />
== PVR текстуры ==<br />
<br />
Файл текстуры, используемый мобильными устройствами (восновном на iOS). Предоставляет контейнер, который хранит сжатые данные текстуры, оптимизированные для графических клипов POWERVR. Разработан для отображения графики в устройствах с небольшим размером пространства на диске, например, в мобильных телефонах.<br />
<br />
Файлы PVR можно сжимать из других форматов изображений, таких как .PNG, при помощи утилиты компрессии Imagination Technologies PVRTC. Поскольку файлы PVR оптимизируются для клипов POWERVR, рекомендуется текстурные графические файлы конвертировать в этот формат на устройствах POWERVR.<br />
Примечание: формат файла PVR является форматом с потерями.<br />
<br />
При упаковке в PVR текстуры можно сэкономить на размере в видео памяти устройства в 8 раз. Также PVR текстуры позволяют уменьшить скорость загрузки в память устройства.<br />
<br />
== Использование памяти ==<br />
<br />
pvr_8888 - 4<br />
<br />
pvrtc - 0.5 + 1(alpha)<br />
<br />
etc - 0.5 + 1(alpha)<br />
<br />
bc3 - 1<br />
<br />
png - 4 + 4(временно)<br />
<br />
jpg - 3+1(aplha) + (3+1(aplha) (временно))<br />
<br />
== Пример подготовки графики ==<br />
Рассмотрим на примере подготовки графики для интерактивных книг<br />
<br />
'''Анимация'''<br><br />
Анимация, задействованная в интерактивных книгах, разделяется на:<br />
<br />
*'''фреймовая''';<br />
*'''скелетная'''.<br />
<br />
Соответственно с этим, графика может быть:<br />
*в виде полной/частичной перерисовки объектов;<br />
[[Файл:51.png|200px|left]]<br />
[[Файл:52.png|200px|center]]<br />
<br><br />
*с порезкой на отдельные запчасти и их дальнейшим анимированием.<br />
[[Файл:43.png|150px|center]]<br />
[[Файл:42.png|150px|center]]<br />
[[Файл:41.png|150px|center]]<br />
<br />
При подготовке графики следует учесть что она подразделяется на:<br />
*статический цельный фоновый рисунок (в формате jpeg/png);<br />
*отдельные объекты, используемые в анимации (должны иметь прозрачность, в формате png).<br />
<br />
У нас имеется статический фон (поляна, замок, небо) и отдельный объект облако, которое может двигаться слева-направо (или наоборот). Целесообразнее было бы соединить замок, поляну и небо в один слой. Но так как облако должно пролетать за замком, то небо должно быть отдельным слоем. В итоге получаем:<br />
отдельно замок<br />
[[Файл:32.png|300px|left]]<br />
[[Файл:31.png|300px|center]]<br><br />
*отдельно небо (в виде градиентной полосы, которую будем растягивать модификатором)<br />
[[Файл:61.png|300px|center]]<br><br />
<br />
*отдельно облако<br />
[[Файл:21.png|150px|center]]<br><br />
<br />
*При анимировании рук графика плеча и предплечья в основании сгибов должна быть скругленной и заходить за объект прятания. Контуры у основания сгиба обрывистые.<br><br />
[[Файл:Pic12.png|200px|left]]<br />
[[Файл:Pic11.png|200px|left]]<br />
<br />
[[Category:Projects]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=2048&diff=986120482019-08-01T14:58:22Z<p>Apolozova: </p>
<hr />
<div>{{TOC right}}<br />
'''2048''' (twentyfourtyeight) - встроенный объект редактора, который реализует механику игры [https://ru.wikipedia.org/wiki/2048_(%D0%B8%D0%B3%D1%80%D0%B0) 2048]. <br />
<br />
== Правила игры ==<br />
<br />
1. Для игры используется поле размером 4х4, по которому могут перемещаться плитки с цифрами(цифры, являются степенью 2).<br /><br />
2. В начале игры на поле имеется 2 плитки, с номиналом 2 или 4.<br /><br />
3. С помощью свайпа игрок может скинуть все плитки игрового поля в одну из 4 сторон.<br /><br />
4. После свайпа в свободной клетке появляется плитка с номиналом 2 или 4.<br /><br />
5. Если при сбрасывании две плитки одного номинала «налетают» одна на другую, то они слипаются в одну,<br /> номинал которой равен сумме соединившихся плиток.<br /><br />
6. Если при свайпе местоположение плиток или их номинал не изменится, то ход не совершается.<br /><br />
7. За каждое соединение игровые очки увеличиваются на номинал получившейся плитки.<br /><br />
8. Игра заканчивается, если после очередного хода невозможно совершить действие.<br /><br />
9. Для победы нужно получить плитку номиналом 2048(или другое значение, указанное в параметрах).<br /><br />
<br />
<br />
== Основные параметры ==<br />
<br />
Кроме базовых параметров [[Object|объекта]], имеет ряд специализированных параметров.<br />
[[Файл:Param.png|thumb|right|500|Параметры объекта 2048]]<br />
<br />
''(Курсивом в скобках указан id параметра, или состояния)''.<br />
<br />
*'''ячейка сетки''' ''(cell_res)'' - Графический ресурс, для отображения плитки.<br />
*'''ободок ячейки''' ''(cell_border_res)'' - Графический ресурс ободка плитки.<br />
*'''графика цифр''' ''(num_pics)'' - Клип с картинками цифр. Цифрам 2,4,8,16,32... соответствую кадры 0,1,2,3,4....<br />
<br />
<br />
'''Группа - размер поля''' - Позволяет изменять размер стандартного игрового поля (4х4).<br />
*'''столбцов''' ''(cols)'' - Ширина игрового поля.<br />
*'''строк''' ''(rows)'' - Высота игрового поля.<br />
<br />
<br />
*'''задержка анимации числа''' ''(number_scaling_delay)'' - Задержка после анимации появления, после которой начнётся анимация числа внутри ячейки.<br />
*'''область текста''' ''(max_cell_text_ratio)'' - Максимальная область, занимаемая текстом относительно размеров ячейки.<br />
*'''время перемещения''' ''(item_moving_time)'' - Время, за которое элементы будут перемещены в одну сторону в миллисекундах.<br />
*'''чувствительность свайпа''' ''(swipe_length)'' - Количество пикселей, которые нужно провести, прежде чем сработает событие свайпа.<br />
*'''пульсация при матче''' ''(scale_number_on_match)'' - Разрешает анимацию номера внутри ячейки после матча.<br />
*'''пульсация при появлении''' ''(scale_number_on_appear)'' - Разрешает анимацию номера внутри ячейки при появлении.<br />
<br />
<br />
'''Группа - анимация появления'''<br />
*'''время масштабирования''' ''(item_scaling_time)'' - Время за которое масштаб достигнет максимума в миллисекундах.<br />
*'''минимум масштаба''' ''(item_scaling_start)'' - Пороговое значение масштаба, с которого элемент начнёт увеличиваться.<br />
*'''максимум масштаба''' ''(item_scaling_end)'' - Пороговое значение масштаба, после которого элемент начнёт уменьшаться.<br />
<br />
<br />
'''Группа - шрифт'''<br />
*'''имя''' ''(font)'' - Ещё не реализовано.<br />
*'''размер''' ''(font_size)'' - Размер шрифта в пикселях.<br />
<br />
<br />
'''Группа - звуки'''<br />
*'''звук свайпа''' ''(swipe_sound)'' - Id звука в редакторе ресурсов. Перетягивается мышкой с редактора ресурсов(Поле должно быть активно для редактирования).<br />
*'''звук появления''' ''(appear_sound)'' - Id звука в редакторе ресурсов. Перетягивается мышкой с редактора ресурсов(Поле должно быть активно для редактирования).<br />
*'''звук матча''' ''(match_sound)'' - Id звука в редакторе ресурсов. Перетягивается мышкой с редактора ресурсов(Поле должно быть активно для редактирования).<br />
<br />
<br />
*'''счетчик очков''' ''(score_counter)'' - Счетчик, куда будут выводится заработанные очки.<br />
*'''набрать очков''' ''(score_to_reach)'' - Количество очков которые требуются, чтобы выиграть игру.<br />
*'''достигнуть значения''' ''(value_to_reach)'' - Достигнуть значения на поле, чтобы выиграть. Значение должно быть степенью двойки.<br />
<br />
<br />
<br />
== Добавляемые параметры ==<br />
[[Файл:Additional option.png|thumb|right|500px|Дополнительные параметры объекта 2048]]<br />
<br />
[[Файл:+.png]] '''Добавить цвет для значения'''''(color_list)'' - Добавить цвет ячейки, соответствующий определённому значению.<br />
*'''значение''' ''(item_value)'' - Значение. Должно быть степенью двойки. Ноль для цвета фона.<br />
*'''цвет фона''' ''(item_color)'' - Цвет ячейки с соответствующим значением.<br />
*'''цвет шрифта''' ''(item_font_color)'' - Цвет шрифта ячейки, которым будет отрисовано значение.<br />
<br />
<br />
[[Файл:+.png]] '''игра проиграна: изменить параметр (свойство) объекта'''''(game_lost_param)'' - Когда игра проиграна изменить параметр объекта.<br />
*'''объект''' ''(obj)'' - После успешной вставки этот объект меняет свой параметр.<br />
*'''свойство''' ''(par)'' - Параметр, который мы изменяем.<br />
*'''значение''' ''(val)'' - Новое значение параметра.<br />
<br />
[[Файл:+.png]] '''игра проиграна: изменить состояние объекта'''''(game_lost_state)'' - Когда игра проиграна перевести объект в новое состояние.<br />
*'''объект''' ''(obj)'' - После успешной вставки этот объект переходит в состояние из следующего поля.<br />
*'''состояние''' ''(st)'' - Новое состояние для объекта из предыдущего поля.<br />
<br />
[[Файл:+.png]] '''игра выиграна: достигнуто значение'''''(game_value_reached_param)'' - Когда игра выиграна изменить параметр объекта.<br />
*'''объект''' ''(obj)'' - После успешной вставки этот объект меняет свой параметр.<br />
*'''свойство''' ''(par)'' - Параметр, который мы изменяем.<br />
*'''значение''' ''(val)'' - Новое значение параметра.<br />
<br />
[[Файл:+.png]] '''игра выиграна: достигнуто значение'''''(game_value_reached_state)'' - Когда игра выиграна перевести объект в новое состояние.<br />
*'''объект''' ''(obj)'' - После успешной вставки этот объект переходит в состояние из следующего поля.<br />
*'''состояние''' ''(st)'' - Новое состояние для объекта из предыдущего поля.<br />
<br />
[[Файл:+.png]] '''игра выиграна: набраны очки'''''(game_score_reached_param)'' - Когда игра выиграна изменить параметр объекта.<br />
*'''объект''' ''(obj)'' - После успешной вставки этот объект меняет свой параметр.<br />
*'''свойство''' ''(par)'' - Параметр, который мы изменяем.<br />
*'''значение''' ''(val)'' - Новое значение параметра.<br />
<br />
[[Файл:+.png]] '''игра выиграна: набраны очки'''''(game_score_reached_state)'' - Когда игра выиграна перевести объект в новое состояние.<br />
*'''объект''' ''(obj)'' - После успешной вставки этот объект переходит в состояние из следующего поля.<br />
*'''состояние''' ''(st)'' - Новое состояние для объекта из предыдущего поля.<br />
<br />
[[Файл:+.png]] '''достигнуто новое максимальное значение'''''(game_reached_new_max_value_param)'' - Достигнуто новое максимальное значение в клетке: изменить параметр (свойство) объекта. Само значение можно получить из поля maxValue.<br />
*'''объект''' ''(obj)'' - После успешной вставки этот объект меняет свой параметр.<br />
*'''свойство''' ''(par)'' - Параметр, который мы изменяем.<br />
*'''значение''' ''(val)'' - Новое значение параметра.<br />
<br />
[[Файл:+.png]] '''достигнуто новое максимальное значение'''''(game_reached_new_max_value_state)'' - Достигнуто новое максимальное значение в клетке: изменить состояние объекта. Само значение можно получить из поля maxValue.<br />
*'''объект''' ''(obj)'' - После успешной вставки этот объект переходит в состояние из следующего поля.<br />
*'''состояние''' ''(st)'' - Новое состояние для объекта из предыдущего поля.<br />
<br />
[[Файл:+.png]] '''ход завершен'''''(turn_done_param)'' - Изменить параметр (свойство) объекта, когда был сделан ход.<br />
*'''объект''' ''(obj)'' - После успешной вставки этот объект меняет свой параметр.<br />
*'''свойство''' ''(par)'' - Параметр, который мы изменяем.<br />
*'''значение''' ''(val)'' - Новое значение параметра.<br />
<br />
[[Файл:+.png]] '''ход завершен'''''(turn_done_state)'' - Изменить состояние объекта, когда был сделан ход.<br />
*'''объект''' ''(obj)'' - После успешной вставки этот объект переходит в состояние из следующего поля.<br />
*'''состояние''' ''(st)'' - Новое состояние для объекта из предыдущего поля.<br />
<br />
<br />
== Примечания и дополнения ==<br />
Из объекта можно вычитать несколько значений: '''maxValue''', '''maxValueCellX''', '''maxValueCellY'''.<br />
*'''maxValue''' - максимальное значение в клетке. Есть одна особенность: если сделать переход на другой экран по событию "игра выиграна: достигнуто значение" и при этом считывать maxValue, с дальнейшей записью в опции. То в опциях будет записано предыдущее значение maxValue.<br />
То есть, если для победы нужно набрать 2048, то при получении этого числа в соответствующую переменную в опциях будет записано 1024.<br />
*'''maxValueCellX''' - координата x ячейки(собранной первой) с максимальным значением.<br />
*'''maxValueCellY''' - координата y ячейки(собранной первой) с максимальным значением.<br />
<br />
Одно из возможных применений данных координат: вместе с событием "достигнуто новое максимальное значение" сделать эффект для сборки нового максимального значения.<br />
<br />
При использовании была замечена ситуация некорректной работы объекта: на игровом поле размещалась неподвижная плитка, которая иногда пряталась под другие плитки, иногда прятала плитки под себя. С другими плитками не матчилась. В основном данная ситуация наблюдалась когда управление реализовывалось с помощью клавиш. И возникала при многократном нажатии всех 4 клавиш. ''(В скором времени будет исправлено.)''<br />
<br />
Свою конфигурацию объект не запоминает. Продолжить работу с объектом при возвращении после перехода на другой экран нельзя.<br />
<br />
== Состояния ==<br />
Объекту можно передавать состояния: '''create_items''', '''undo''', '''skip''', '''swipe_left''', '''swipe_right''', '''swipe_up''', '''swipe_down''', '''mix''', '''restart'''.<br />
*'''swipe_(right, left, up, down)''' - Передача данных состояний объекту равносильно свайпу в соответствующем направлении. С помощью данных состояний можно управлять объектом кнопками(или другими объектами) на экране. Также, если использовать объект controls, можно реализовать управление с помощью клавиш.<br />
*'''create_items''' - Используется для запуска объекта. При этом на поле появляются 2 плитки.<br />
*'''undo''' - Используется для отмены хода. Отменить можно только один ход. Использовать осторожно, так как, если сделать отмену до первого свайпа, то отменится состояние "create_items". И на экране будет пустое игровое поле. ''(Данная ситуация в процессе доработки программистами)''<br />
*'''skip''' - Пропуск хода. При использовании появляется новая плитка без совершения свайпа. Также после передачи этого состояния сработает событие "ход завершен".<br />
*'''mix''' - Перемешает плитки на игровом поле.<br />
*'''restart''' - Полностью перезапустит игру.<br />
<br />
== Пример ==<br />
Можно посмотреть по адресу:<br />
S:\!MOBILE\!!!EditorGames\Wiki_sample\2048.7z<br />
<br />
== Настройка игрового объекта ==<br />
[[Category:Game mechanic]]<br />
<br />
Настроим проект 2048.<br />
Создаем объект twentyfourtyeight и задаем ему значения: <br />
<br />
[[Файл:w3.png|200px|thumb|right|2048]]<br />
[[Файл:w1.png]]<br />
[[Файл:w4.png|right]]<br />
<br />
После настройки объекта twentyfourtyeight необходимо добавить 4 кнопки ([[button]]) управления: <br />
<br />
*arrow_down_norm (вниз), <br />
<br />
*arrow_left_norm (лево), <br />
<br />
*arrow_right_norm (право), <br />
<br />
*arrow_up_norm (вверх)<br />
<br />
Для связи кнопок с игрой необходимо создать в объекте [[controls]] 4 копии машин down, left, right, up.<br />
<br />
(в машинах меняеться только состояние)<br />
<br />
*swip_down (вниз),<br />
<br />
*swip_left (лево), <br />
<br />
*swip_right (право), <br />
<br />
*swip_up (вверх).<br />
<br />
[[Файл:w5.png]] [[Файл:w6.png]]<br />
<br />
В машине start_game прописываем запуск игры<br />
<br />
[[Файл:w7.png]]<br />
<br />
В таймере ([[timer]]) и счетчиках ([[counter]]) прописываем уровень игры<br />
<br />
[[Файл:w8.png]] [[Файл:w9.png]]<br />
<br />
Для кнопок «пропустить ход» и «отменить ход» создаем машины с двумя состояниями, в кнопках изменяем состояние объекта<br />
<br />
[[Файл:w10.png]]<br />
<br />
Для кнопки «сброс» машина reset_game<br />
<br />
[[Файл:w11.png]]<br />
<br />
Для сохранения игровых параметров, использования на итоговом экране и переходим на этот экран создаем машину data_save<br />
<br />
[[Файл:w12.png|data_save]]<br />
<br />
На экране результатов создаем 3 счетчика, таймер, текст и кнопки перехода. <br />
<br />
[[Файл:w13.png|200px|thumb||left|Экран результатов game_result]]<br />
<br />
[[Файл:w14.png]]<br />
<br />
Машина occured_victory нужна для показания результатов игры<br />
<br />
В обьекте 2048 указываем состояние машины occured_victory<br />
<br />
[[Файл:w15.png|occured_victory]] <br />
<br />
[[Файл:w16.png]]<br />
<br />
Машина reference_values передает в счетчики значения (запускается машиной data_save)<br />
<br />
[[Файл:w17.png|reference_values]]<br />
<br />
Машина result_game выводит текст на экран результатов с активными масками<br />
<br />
[[Файл:w18.png|result_game]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0_%D0%BC%D0%B8%D0%BD%D0%B8%D0%B8%D0%B3%D1%80&diff=9860Настройка миниигр2019-07-30T13:20:44Z<p>Apolozova: /* Store */</p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Создание игры «Hidden Object Game»|Урок 7]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Работа с эффектами|Урок 9]]<br />
|}<br />
----<br />
{{TOC right}}<br />
<br />
'''Цель:''' изучить настройки объектов, реализующих различные минигры.<br />
<br />
'''Задачи:''' <br />
* создать уровень игры с объектом, содержащим тип механики Puzzle<br />
* создать уровень игры с объектом, содержащим тип механики Patchwork <br />
<br />
== Puzzle ==<br />
<br />
=== Создание экрана и сцены в игровом проекте ===<br />
<br />
Запускаем SceneEditor. Открываем наш учебный проект lessons.seproj.<br />
<br />
Создаём экран lesson_8, а в нём сцены 08 и Buttons (стараемся делать это по памяти или подсматриваем в прошлых уроках), куда добавляем необходимые графические ресурсы из папки этого урока в Resources Editor: в экран 08 отправляем картинку level_01 (наш будущий пазл), а в Buttons (думаю, уже догадались) - будущие кнопки - hint_normal и ico_r_normal2. <br />
<br />
На экране кнопочкам подбираем симпатичное и удобное расположение.<br />
<br />
<br />
[[Файл:801.png]]<br />
<br />
=== Настройка объектов, создание машин состояний ===<br />
<br />
Меняем тип картинки '''level_01''' с '''image''' на [[Puzzle|puzzle]] (в папке Game mechanic) и устанавливаем следующие настройки:<br />
<br />
[[Файл:802.png]]<br />
<br />
В сцене '''08''' создаём ещё один объект. Даём ему имя '''applause''', тип '''machine''' (прописываем 2 состояния '''on''' и '''off'''). <br />
<br />
В состоянии '''on''' добавляем команду '''play''' (проиграть звук) и в списке выбираем '''snd''' (короткий звук), который подгружаем с помощью базы ресурсов (если подходящего звукового файла в уроке не обнаружилось, его необходимо добавить самостоятельно). <br />
<br />
Возвращаемся к общим настройкам и устанавливаем стартовое состояние '''off'''. <br />
<br />
[[Файл:803.png]]<br />
<br />
Переходим к сцене '''Buttons''' и меняем тип обоих графических файлов на '''button'''. Общий вид лейаута на этом этапе получится примерно следующий:<br />
<br />
[[Файл:804.png]] <br />
<br />
В настройках кнопок перетянем из базы ресурсов картинки с внешним видом нажатых и отжатых кнопок.<br />
<br />
[[Файл:805.png]] <br />
<br />
Кнопка '''R''' (переиграть) — кнопка, запускающая игру Puzzle сначала. <br />
<br />
Нам необходимо, чтобы кнопка '''R''' перемешивала части нашего пазла. Для этого в настройках кликаем правой кнопкой мыши и выбираем '''клик:изменить состояние объекта'''. В появившейся в настройках вкладке выбираем в качестве объекта наш пазл ('''level_01''') и состояние '''mix''', которое перемешает части исходной картинки.<br />
<br />
[[Файл:806.png]] <br />
<br />
Пусть кнопка '''hint''' (подсказка) по клику показывает нам картинку в собранном виде. Для этого повторяем процедуру с добавлением настройки '''клик:изменить состояние объекта''', только теперь для кнопки '''hint'''. Выбираем объектом наш '''level_01''' и состояние для него '''hint'''. <br />
<br />
<pre><br />
На заметку. Если возникает необходимость добавить 2 и более настройки при помощи правой кнопки мыши, <br />
то лучше из кнопки сделать машину состояний и все состояния создать уже там.<br />
</pre><br />
<br />
Любуемся результатом своих стараний, сохранив проект и запустив его с помощью Viewer`а.<br />
<br />
=== Упражнения ===<br />
<br />
Копируем экран '''lesson_8''' и переименовываем его в '''lesson_8_1''', а сцену '''08''' в '''08_01'''.<br />
<br />
[[Файл:807.png]]<br />
<br />
В новом экране вносим все изменения самостоятельно. Необходимо:<br />
<br />
a) заменить звук аплодисментов другим аудиофайлом, имеющимся в базе ресурсов;<br />
<br />
b) в пазле изменить количество разбиваемых частей на шесть (3х2), добавить сетку, изменить перестановку ячеек на смешивание по alpha, изменить время смешивания на 500 миллисекунд;<br />
<br />
c) при нажатии hint (подсказки) изменить время показа подсказки на 2 секунды, изменить время финального показа пазла на 3 секунды, установить время закрытия пазла 500 миллисекунд.<br />
<br />
<br />
=== Store ===<br />
<br />
В реальной игре нам может понадобиться счётчик подсказок, который даёт возможность совершать покупки подсказок за реальные деньги. Для его реализации необходим объект '''[[Store|Store]]'''.<br />
<br />
Создадим новый экран '''lesson_8_1_1'''. Добавим в него сцены '''08_1''' и '''Button_8_1'''. В сцену '''08_1''' поместим из экрана '''lesson_8_1''' объекты '''level_01''' и '''applause''', оставим их без изменения. <br />
<br />
В сцену '''Button_8_1''' скопируем из '''lesson_08_1''' кнопки '''hint_normal''' и '''ico_R_normal2''' и создадим новый объект, поменяв ему тип на '''counter''' (счетчик) и назовём его '''hint'''. Добавим ресурс из базы ресурсов – анимацию c цифрами из прошлого урока. Счётчик '''hint''' будет считывать купленные подсказки.<br />
<br />
[[Файл:808.png]]<br />
<br />
В '''hint_normal''' добавим подобъект, сделаем его машиной и назовем '''hint_m'''.<br />
<br />
Щёлкнув правой кнопкой мыши на сцену '''Button_8_1''' создадим новые сцены '''store''' и '''error''', которые, соответственно, будут предназначены для совершения покупок — начисления подсказок и окна с ошибкой при невозможности купить подсказку.<br />
<br />
В сцену store добавим две машины: '''buy''' и '''store'''; в error - машину '''error'''.<br />
<br />
[[Файл:809.PNG]]<br />
<br />
В машине '''store''' зададим считывания со счётчика и прозрачность экрана:<br />
<br />
[[Файл:810.png]]<br />
<br />
Машина '''error''' будет отвечать за вывод ошибки при неудачной покупке, то есть задаёт прозрачность экрана с ошибкой.<br />
<br />
[[Файл:811.PNG]]<br />
<br />
Для машины '''buy''' зададим состояния, при которых она начисляет купленную подсказку либо вызывает окно ошибки.<br />
<br />
[[Файл:812.PNG]]<br />
<br />
Вернёмся к машине '''hint_m''' сцены '''Button_8_1''' и пропишем для неё состояния. Машина отвечает за начисление подсказки при удачной покупке<br />
<br />
[[Файл:813.PNG]]<br />
<br />
Для того, чтобы вызывать машину '''hint_m''' в нашей игре, откроем кнопку '''hint_normal''' и в добавляемом свойстве '''изменить состояние объекта''' в качестве объекта выберем машину '''hint_m''', и пропишем ей состояние '''check'''.<br />
<br />
'''Совершение покупки (настройка Store)'''<br />
<br />
Для того чтобы покупку можно было совершить, необходимо задать в глобальных свойствах возможность совершения покупки. Для этого на сцене в глобальном экране opt добавим новый элемент, которому изменим тип на store (в папке Options).<br />
<br />
<pre><br />
На заметку. Store в проекте может быть только один.<br />
</pre><br />
<br />
[[Файл:814.PNG]]<br />
<br />
Дважды клацнув на объект (так же, как на машину состояний), мы попадаем в окно настроек '''store'''.<br />
<br />
[[Файл:815.PNG]]<br />
<br />
Нажимаем на плюсик и создаём покупку. Вводим для неё id и изменяем указанные настройки, как на картинке.<br />
<br />
[[Файл:816.PNG]]<br />
<br />
И тут должен возникнуть вопрос. Почему среди перечня доступных объектов нет необходимого нам '''buy'''? Прежде чем читать дальше, предлагаю попробовать найти ответ на этот вопрос самостоятельно.<br />
<br />
<br />
<br />
Для удобства использования, а также во избежание различных ошибок, в объектах экрана можно обращаться только к объектам этого же экрана. Исключением будут объекты глобальных экранов (вспоминаем прошлые уроки и смотрим на наш глобальный экран '''opt'''). <br />
<br />
Поэтому, чтобы получить доступ к объекту '''buy''', мы временно делаем экран '''lesson_8_1_1''' глобальным и завершаем настройку объекта '''store'''. Позже, на этапе проверки при помощи Viewer`а можем поэкспериментировать и проверить, будет ли работать проект корректно, когда мы в настройках глобальности экрана '''lesson_8_1_1''' снова поставим '''нет'''.<br />
<br />
<pre><br />
На заметку. Когда мы обращаемся к объекту, то в layout.xml <br />
прописывается ссылка на этот объект в виде его id.<br />
Когда убираем глобальность экрана и делаем его снова обычным, <br />
выбранный объект мы в редакторе больше не видим, <br />
но его id в лэйауте всё равно остаётся.<br />
</pre><br />
<br />
<br />
'''Описание объекта Store'''<br />
<br />
Объект '''Store''' необходим для описания InApp покупок (позволяют продавать отдельные бонусы, паки и т.п.) в игре.<br />
<br />
Основные параметры объекта Store<br />
<br />
''id покупки'' – внутренний id покупки.<br />
<br />
''расходуемая'' – 1 – покупка расходуемая, 0 – покупка раз и навсегда; если параметр не указан, по-умолчанию покупка – одноразовая.<br />
<br />
''объект (restore)'' – объект - Слушатель восстановления покупки. Этому объекту будет сообщено об успехе восстановления этой покупки покупки.<br />
состояние (restore) – это состояние будет установлено объекту при успешном восстановлении этой покупки.<br />
<br />
'''Для того, чтобы объект Store работал во Viewer, необходимо подкорректировать файл app.icf'''<br />
<br />
1. Найти файл app.icf в папке с вашим проектом.<br />
<br />
2. Открыть его и найти тег [Game].<br />
<br />
3. В теге Game добавить строку purchaseEverything=1.<br />
<br />
4. Сохранить файл<br />
<br />
<pre><br />
<br />
[Game]<br />
purchaseEverything=1<br />
DispFixRot="Landscape"<br />
# comments and whitespace stripped by deployment tool<br />
debug="Absolutist-2253"<br />
show_build_date=1<br />
AppTitle="Viewer"<br />
DebuggerIP="127.0.0.1"<br />
DebuggerPort=5322<br />
<br />
</pre><br />
<br />
<br />
<br />
'''Оформление'''<br />
<br />
Теперь перейдём к оформлению. Для того чтобы на экране появлялось окно с предложением о покупке подсказки, необходимо его создать. В начальный момент окно должно быть невидимым и прокликиваем, это состояние задано в машине '''store'''. Создадим в ней 5 подобъектов.<br />
<br />
<br />
Первые два переименуем в '''black''' и '''rec''', изменим им тип на '''[[Rectangle|Rectangle]]'''.<br />
<br />
Откроем объект '''black''', пропишем ему свойства, оставив пустой рамку, цвет фона – чёрный.<br />
<br />
Для объекта '''rec''' зададим рамку и текстуру заливки. Для этого из базы ресурсов мышкой перетащим соответствующие элементы. Ресурсы для графики находятся в предыдущем уроке. Чтобы прямоугольник отображался правильно, задайте ему ненулевые размеры. Настройки '''rec''' (имена файлов могут отличаться):<br />
<br />
[[Файл:817.PNG]]<br />
<br />
Третьему элементу поменяем тип на '''text''' с текстом "Купить подсказку?"<br />
<br />
Четвёртый объект сделаем машиной и назовём её '''ok'''. Она будет в глазах пользователя совершать покупку. Для внешнего вида машины в '''res''' перетянем изображение зелёного света светофора из 4 урока. В модификаторах можно задать '''scale''' по х и по у 0.5.<br />
Опишем следующие состояния машины:<br />
<br />
[[Файл:818.PNG]]<br />
<br />
Все действия, связанные с совершением и провалом покупки, управляемые этой машиной, мы уже указали в '''store'''.<br />
<br />
Пятый объект будет кнопкой '''no'''. Она по клику изменять состояние ('''close''') объекта ('''store'''). Для внешнего вида кнопки в '''res''' перетянем изображение красного света светофора из 4 урока. В модификаторах тоже можно задать '''scale''' по х и по у 0.5.<br />
<br />
Так же поступим со сценой '''error'''. В ней создадим четыре объекта: два '''rectangle''': '''rec_error''' – пустой, '''black_error''' — их можно скопировать из предыдущей сцены; кнопку '''buy''', которая будет переводить '''error''' в состояние '''i'''; текстовый объект '''text_error''' с текстом «error!». Общий вид этого задания в лейауте примерно следующий:<br />
<br />
<br />
[[Файл:819.PNG]]<br />
<br />
Разместим все объекты так, что бы картинка хорошо смотрелась. Сохраним все изменения и запустим Viewer. Сейчас при покупке подсказки количество покупок не имеет лимита (благодаря нашим изменениям в '''app.icf'''), поэтому вывод ошибки мы не получим.<br />
<br />
== Patchwork ==<br />
<br />
=== Создание экрана и сцены в игровом проекте ===<br />
<br />
1. Запустить SceneEditor.<br />
<br />
2. В меню Проект → Загрузить → Learning.seproj. <br />
<br />
3. Кликнув правой кнопкой мыши по ранее созданному экрану Lesson_08.1, создать экран Lesson_08.2.<br />
<br />
[[Файл:Lesson8_1.jpg|right]]<br />
<br />
4. В экране Lesson_08.2 создать новую сцену 08, в которую (через ResourcesEditor) добавить графические ресурсы (bg_game, panel_down, btb_replay_normal) из папки Sources\Lesson_08 (см. подготовка к работе «Создание проекта»). В редактор ресурсов добавить графику нашего будущего Patchwork: level_17, level_17_mask.<br />
<br />
=== Настройка объектов ===<br />
<br />
1. Создадим на сцене 08 еще два объекта. Для этого нажмем правой кнопкой мыши по сцене и выберем "Создать объект в текущем элементе".<br />
<br />
[[Файл:Lesson8_2.jpg]]<br />
<br />
2. Переименуем один из созданных объектов в Patchwork, а другой в table.<br />
<br />
[[Файл:Lesson8_3.jpg]]<br />
<br />
[[Файл:Lesson8_4.jpg|right]]<br />
<br />
3. Теперь будем изменять тип объектов на сцене, чтобы получить нужные нам элементы. Графические ресурсы bg_game и panel_down оставляем без изменений. Ресурсу btb_replay_normal изменяем тип на button. Объекту Patchwork меняем тип на patchwork, table изменяем на тип table.<br />
4. Теперь объекты нужно разместить на сцене. Обратим внимание на то, что два последних объекта которые мы добавили без графического ресурса. По умолчанию, создаваемые на сцене объекты имеют размер 100х100 пикселей. Увеличим размер таблицы по высоте до 450 пикселей и перетащим ее влево, поместив над объектом panel_down.<br />
<br />
[[Файл:Lesson8_5.jpg]]<br />
<br />
Кнопку поместим в левый нижний угол. Добиваемся такого расположения объектов, как показанно на рисунке.<br />
<br />
[[Файл:Lesson8_6.jpg]]<br />
<br />
5. Настроим наши объекты. Для кнопки btb_replay_normal в поле "перейти на" укажите текущий экран Lesson_8.2.<br />
<br />
<br />
[[Файл:правка_намба_1.png|200px]]<br />
<br />
<br />
Для таблицы измените следующие параметры<br />
<br />
[[Файл:lesson8_table_setup.png|200px]]<br />
<br />
<br />
Для Patchwork устанавливаем следующие настройки. Обратите внимание, что поля "карт.спереди" и "шаблон" заполняются перетаскиванием графического ресурса из редактора ресурсов.<br />
<br />
[[Файл:Lesson8_9.jpg]]<br />
<br />
6. Для корректной работы вашего Patchwork необходимо, чтобы таблица находилась выше Patchwork по дереву объектов.<br />
<br />
[[Файл:Lesson8_10.jpg]]<br />
<br />
<br />
7. Проверьте выполнение задачи с помощью проигрывателя сцен Viewer.<br />
<br />
[[Файл:Lesson8.3.Fin.png]]<br />
<br />
=== Упражнения ===<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_08.2, создать новый экран Lesson_08.3<br />
<br />
2. Создать новую сцену с названием game.<br />
<br />
3. Скопировать все объекты из сцены 08 (экрана Lesson_08.2).<br />
<br />
4. Вставить скопированые объекты в новую сцену game (экрана Lesson_08.3).<br />
<br />
5. В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) заменить картинку пэчворка и маски на другую, имеющуюся в базе ресурсов;<br />
<br />
b) изменить настройки кнопки рестарта таким образом, чтобы не переходить на экран Lesson_08.3, а сразу передавать пэчворку состояние mix.<br />
----<br />
{| width="100%" <br />
| width="40%"|[[Создание игры «Hidden Object Game»|Урок 7]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Работа с эффектами|Урок 9]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:819.PNG&diff=9859Файл:819.PNG2019-07-30T13:20:32Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:818.PNG&diff=9858Файл:818.PNG2019-07-30T13:19:42Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:817.PNG&diff=9857Файл:817.PNG2019-07-30T13:19:05Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:819.png&diff=9856Файл:819.png2019-07-30T12:54:03Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:818.png&diff=9855Файл:818.png2019-07-30T12:48:01Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:817.png&diff=9854Файл:817.png2019-07-30T12:45:18Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:816.PNG&diff=9853Файл:816.PNG2019-07-30T12:21:03Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:815.PNG&diff=9852Файл:815.PNG2019-07-30T12:20:09Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:814.PNG&diff=9851Файл:814.PNG2019-07-30T12:18:44Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:813.PNG&diff=9850Файл:813.PNG2019-07-30T12:18:03Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:812.PNG&diff=9849Файл:812.PNG2019-07-30T12:15:06Z<p>Apolozova: Apolozova загрузил новую версию Файл:812.PNG</p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:812.PNG&diff=9848Файл:812.PNG2019-07-30T12:14:30Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:811.PNG&diff=9847Файл:811.PNG2019-07-30T12:13:21Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:811.png&diff=9846Файл:811.png2019-07-30T12:11:47Z<p>Apolozova: Apolozova загрузил новую версию Файл:811.png</p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0_%D0%BC%D0%B8%D0%BD%D0%B8%D0%B8%D0%B3%D1%80&diff=9845Настройка миниигр2019-07-30T12:10:59Z<p>Apolozova: /* Упражнения */</p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Создание игры «Hidden Object Game»|Урок 7]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Работа с эффектами|Урок 9]]<br />
|}<br />
----<br />
{{TOC right}}<br />
<br />
'''Цель:''' изучить настройки объектов, реализующих различные минигры.<br />
<br />
'''Задачи:''' <br />
* создать уровень игры с объектом, содержащим тип механики Puzzle<br />
* создать уровень игры с объектом, содержащим тип механики Patchwork <br />
<br />
== Puzzle ==<br />
<br />
=== Создание экрана и сцены в игровом проекте ===<br />
<br />
Запускаем SceneEditor. Открываем наш учебный проект lessons.seproj.<br />
<br />
Создаём экран lesson_8, а в нём сцены 08 и Buttons (стараемся делать это по памяти или подсматриваем в прошлых уроках), куда добавляем необходимые графические ресурсы из папки этого урока в Resources Editor: в экран 08 отправляем картинку level_01 (наш будущий пазл), а в Buttons (думаю, уже догадались) - будущие кнопки - hint_normal и ico_r_normal2. <br />
<br />
На экране кнопочкам подбираем симпатичное и удобное расположение.<br />
<br />
<br />
[[Файл:801.png]]<br />
<br />
=== Настройка объектов, создание машин состояний ===<br />
<br />
Меняем тип картинки '''level_01''' с '''image''' на [[Puzzle|puzzle]] (в папке Game mechanic) и устанавливаем следующие настройки:<br />
<br />
[[Файл:802.png]]<br />
<br />
В сцене '''08''' создаём ещё один объект. Даём ему имя '''applause''', тип '''machine''' (прописываем 2 состояния '''on''' и '''off'''). <br />
<br />
В состоянии '''on''' добавляем команду '''play''' (проиграть звук) и в списке выбираем '''snd''' (короткий звук), который подгружаем с помощью базы ресурсов (если подходящего звукового файла в уроке не обнаружилось, его необходимо добавить самостоятельно). <br />
<br />
Возвращаемся к общим настройкам и устанавливаем стартовое состояние '''off'''. <br />
<br />
[[Файл:803.png]]<br />
<br />
Переходим к сцене '''Buttons''' и меняем тип обоих графических файлов на '''button'''. Общий вид лейаута на этом этапе получится примерно следующий:<br />
<br />
[[Файл:804.png]] <br />
<br />
В настройках кнопок перетянем из базы ресурсов картинки с внешним видом нажатых и отжатых кнопок.<br />
<br />
[[Файл:805.png]] <br />
<br />
Кнопка '''R''' (переиграть) — кнопка, запускающая игру Puzzle сначала. <br />
<br />
Нам необходимо, чтобы кнопка '''R''' перемешивала части нашего пазла. Для этого в настройках кликаем правой кнопкой мыши и выбираем '''клик:изменить состояние объекта'''. В появившейся в настройках вкладке выбираем в качестве объекта наш пазл ('''level_01''') и состояние '''mix''', которое перемешает части исходной картинки.<br />
<br />
[[Файл:806.png]] <br />
<br />
Пусть кнопка '''hint''' (подсказка) по клику показывает нам картинку в собранном виде. Для этого повторяем процедуру с добавлением настройки '''клик:изменить состояние объекта''', только теперь для кнопки '''hint'''. Выбираем объектом наш '''level_01''' и состояние для него '''hint'''. <br />
<br />
<pre><br />
На заметку. Если возникает необходимость добавить 2 и более настройки при помощи правой кнопки мыши, <br />
то лучше из кнопки сделать машину состояний и все состояния создать уже там.<br />
</pre><br />
<br />
Любуемся результатом своих стараний, сохранив проект и запустив его с помощью Viewer`а.<br />
<br />
=== Упражнения ===<br />
<br />
Копируем экран '''lesson_8''' и переименовываем его в '''lesson_8_1''', а сцену '''08''' в '''08_01'''.<br />
<br />
[[Файл:807.png]]<br />
<br />
В новом экране вносим все изменения самостоятельно. Необходимо:<br />
<br />
a) заменить звук аплодисментов другим аудиофайлом, имеющимся в базе ресурсов;<br />
<br />
b) в пазле изменить количество разбиваемых частей на шесть (3х2), добавить сетку, изменить перестановку ячеек на смешивание по alpha, изменить время смешивания на 500 миллисекунд;<br />
<br />
c) при нажатии hint (подсказки) изменить время показа подсказки на 2 секунды, изменить время финального показа пазла на 3 секунды, установить время закрытия пазла 500 миллисекунд.<br />
<br />
<br />
=== Store ===<br />
<br />
В реальной игре нам может понадобиться счётчик подсказок, который даёт возможность совершать покупки подсказок за реальные деньги. Для его реализации необходим объект '''[[Store|Store]]'''.<br />
<br />
Создадим новый экран '''lesson_8_1_1'''. Добавим в него сцены '''08_1''' и '''Button_8_1'''. В сцену '''08_1''' поместим из экрана '''lesson_8_1''' объекты '''level_01''' и '''applause''', оставим их без изменения. <br />
<br />
В сцену '''Button_8_1''' скопируем из '''lesson_08_1''' кнопки '''hint_normal''' и '''ico_R_normal2''' и создадим новый объект, поменяв ему тип на '''counter'''(счетчик) и название на '''hint'''. Добавим ресурс из базы ресурсов – анимацию c цифрами из прошлого урока. Счётчик '''hint''' будет считывать купленные подсказки.<br />
<br />
[[Файл:808.png]]<br />
<br />
В '''hint_normal''' добавим подобъект, сделаем его машиной и назовем '''hint_m'''.<br />
<br />
Щёлкнув правой кнопкой мыши на сцену '''Button_8_1''' создадим новые сцены '''store''' и '''error''', которые, соответственно, будут предназначены для совершения покупок — начисления подсказок и окна с ошибкой при невозможности купить подсказку.<br />
<br />
В сцену store добавим две машины: '''buy''' и '''store'''; в error - машину '''error'''.<br />
<br />
[[Файл:809.PNG]]<br />
<br />
В машине '''store''' зададим считывания со счётчика и прозрачность экрана:<br />
<br />
[[Файл:810.png]]<br />
<br />
Машина '''error''' будет отвечать за вывод ошибки при неудачной покупке, то есть задает прозрачность экрана с ошибкой.<br />
<br />
[[Файл:811.PNG]]<br />
<br />
Для машины '''buy''' зададим состояния, при которых она начисляет купленную подсказку либо вызывает окно ошибки.<br />
<br />
[[Файл:812.PNG]]<br />
<br />
Вернёмся к машине '''hint_m''' сцены '''Button_8_1''' и пропишем для неё состояния. Машина отвечает за начисление подсказки при удачной покупке<br />
<br />
[[Файл:813.PNG]]<br />
<br />
Для того, чтобы вызывать машину '''hint_m''' в нашей игре, откроем кнопку '''hint_normal''' и в свойстве '''изменить состояние объекта''' в качестве объекта выберем машину '''hint_m''', и пропишем ей состояние '''check'''.<br />
<br />
'''Совершение покупки'''<br />
<br />
Для того что бы покупку можно было совершить, необходимо задать в глобальных свойствах возможность совершения покупки. Для этого на сцене в глобальном экране opt добавим новый элемент, которому изменим тип на store (в папке Options).<br />
<br />
<pre><br />
<br />
На заметку. Store в проекте может быть только один.<br />
<br />
</pre><br />
<br />
[[Файл:814.PNG]]<br />
<br />
Дважды клацнув на объект (так же, как на машину состояний), мы попадаем в окно настроек Store.<br />
<br />
[[Файл:815.PNG]]<br />
<br />
Нажимаем на плюсик и создаём покупку. Вводим для неё id и изменяем указанные настройки, как на картинке.<br />
<br />
[[Файл:816.PNG]]<br />
<br />
И тут должен возникнуть вопрос. Почему среди перечня доступных объектов нет необходимого нам buy? Прежде чем читать дальше, предлагаю попробовать найти ответ на этот вопрос самостоятельно.<br />
<br />
<br />
<br />
Для удобства использования, а также во избежание различных ошибок, в объектах экрана можно обращаться только к объектам этого же экрана. Исключением будут объекты глобальных экранов (вспоминаем прошлые уроки и смотрим на наш глобальный экран '''opt'''). <br />
<br />
Поэтому, чтобы получить доступ к объекту buy, мы временно делаем экран '''lesson_8_1_1''' глобальным и завершаем настройку объекта store. Позже, на этапе проверки при помощи Viewer`а можем поэкспериментировать и проверить, будет ли работать проект корректно, когда мы в настройках глобальности экрана '''lesson_8_1_1''' снова поставим '''нет'''.<br />
<br />
<pre><br />
<br />
На заметку. Когда мы обращаемся к объекту, то в layout.xml <br />
прописывается ссылка на этот объект в виде его id.<br />
Когда убираем глобальность экрана и делаем его снова обычным, <br />
мы его в редакторе не видим, но id в лэйауте всё равно остаётся.<br />
<br />
</pre><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
'''Описание объекта Store'''<br />
<br />
Объект '''Store''' необходим для описания InApp покупок (позволяют продавать отдельные бонусы, паки и т.п.) в игре.<br />
<br />
Основные параметры объекта Store<br />
<br />
''id покупки'' – внутренний id покупки.<br />
<br />
''Расходуемая'' – 1 – покупка расходуемая, 0 – покупка раз и навсегда, если параметр не указан, по-умолчанию покупка – одноразовая.<br />
<br />
''объект (restore)'' – объект - Слушатель восстановления покупки. Этому объекту будет сообщено об успехе восстановления этой покупки покупки.<br />
состояние (restore) – это состояние будет установлено объекту при успешном восстановлении этой покупки.<br />
<br />
'''Для того, чтобы объект Store работал во Вьювере, нужно подкорректировать файл app.icf'''<br />
<br />
1. Найти файл app.icf в папке с вашим проектом.<br />
<br />
2. Открыть его и найти тег [Game].<br />
<br />
3. В теге Game добавить строку purchaseEverything=1.<br />
<br />
4. Сохранить файл<br />
<br />
<pre><br />
<br />
[Game]<br />
purchaseEverything=1<br />
DispFixRot="Landscape"<br />
# comments and whitespace stripped by deployment tool<br />
debug="Absolutist-2253"<br />
show_build_date=1<br />
AppTitle="Viewer"<br />
DebuggerIP="127.0.0.1"<br />
DebuggerPort=5322<br />
<br />
</pre><br />
<br />
<br />
<br />
'''Оформление'''<br />
<br />
Теперь перейдем к оформлению. Для того что бы на экране появлялось окно с предложением о покупке подсказке необходимо его создать. В начальный момент оно должно быть невидимым и прокликиваем, это состояние задано в машине store. Создадим в ней 5 подобъектов.<br />
<br />
<br />
1.1. Первые два переименуем в '''black''' и '''rec''', изменим им тип на '''[[Rectangle|Rectangle]]'''.<br />
<br />
Откроем объект black, пропишем ему свойствах, оставив его пустым рамку, и цвет фона<br />
<br />
[[Файл:Black.PNG]]<br />
<br />
Для объекта rec зададим рамку и текстуру заливки. Для этого из базы ресурсов мышкой перетащим соответствующие элементы. Ресурсы для графики находятся в предыдущем уроке. Чтобы прямоугольник отображался правильно, задайте ему ненулевые размеры.<br />
<br />
[[Файл:Rec.PNG]]<br />
<br />
Чтобы прямоугольник отображался правильно, задайте ему ненулевые параметры размера.<br />
<br />
1.2. Третьему элементу поменяем тип на text с текстом<br />
<br />
[[Файл:Text.PNG]]<br />
<br />
<br />
1.3. Четвертый и пятый объекты сделаем кнопками, и назовем их '''ok''' – купить подсказку, '''no''' – отказаться от покупки. <br />
<br />
Для кнопки ok из базы ресурсов выберем внешний вид<br />
<br />
[[Файл:Ok1.PNG]]<br />
<br />
и зададим переход на совершение или провал покупки. Для этого кликнем правой кнопкой мыши на свойстве позиционирование и добавим свойство совершить in-app покупку, заполним для нее поля как указано на картинки<br />
<br />
[[Файл:Ok2.PNG]]<br />
<br />
Аналогично поступим с кнопкой no. Добавим графический ресурс и свойство «изменить состояние объекта», которое будет закрывать окно с предложением о покупке<br />
<br />
[[Файл:No1.PNG]] [[Файл:No2.PNG]]<br />
<br />
<br />
2. Так же сделаем со сценой error. В ней создадим четыре объекта: два rectangle: '''rec_error''' – пустой, '''black_error''' — оформленный в такую же рамку; кнопку '''buy''', которая будет делать активным состояние error; текстовый объект '''text_error''' с текстом «error!»<br />
<br />
[[Файл:Buy1.PNG]]<br />
<br />
Разместим все объекты так, что бы картинка хорошо смотрелась. Сохраним все изменения и запустим вьювер. <br />
<br />
[[Файл:Снимок1.PNG]] <br />
<br />
Сейчас при покупке подсказки количество покупок не имеет лимита, по этому вывод ошибки мы не получим. Этот параметр в реальной игре будет реализован с помощью объекта store, заданием ему соответствующих свойств.<br />
<br />
== Patchwork ==<br />
<br />
=== Создание экрана и сцены в игровом проекте ===<br />
<br />
1. Запустить SceneEditor.<br />
<br />
2. В меню Проект → Загрузить → Learning.seproj. <br />
<br />
3. Кликнув правой кнопкой мыши по ранее созданному экрану Lesson_08.1, создать экран Lesson_08.2.<br />
<br />
[[Файл:Lesson8_1.jpg|right]]<br />
<br />
4. В экране Lesson_08.2 создать новую сцену 08, в которую (через ResourcesEditor) добавить графические ресурсы (bg_game, panel_down, btb_replay_normal) из папки Sources\Lesson_08 (см. подготовка к работе «Создание проекта»). В редактор ресурсов добавить графику нашего будущего Patchwork: level_17, level_17_mask.<br />
<br />
=== Настройка объектов ===<br />
<br />
1. Создадим на сцене 08 еще два объекта. Для этого нажмем правой кнопкой мыши по сцене и выберем "Создать объект в текущем элементе".<br />
<br />
[[Файл:Lesson8_2.jpg]]<br />
<br />
2. Переименуем один из созданных объектов в Patchwork, а другой в table.<br />
<br />
[[Файл:Lesson8_3.jpg]]<br />
<br />
[[Файл:Lesson8_4.jpg|right]]<br />
<br />
3. Теперь будем изменять тип объектов на сцене, чтобы получить нужные нам элементы. Графические ресурсы bg_game и panel_down оставляем без изменений. Ресурсу btb_replay_normal изменяем тип на button. Объекту Patchwork меняем тип на patchwork, table изменяем на тип table.<br />
4. Теперь объекты нужно разместить на сцене. Обратим внимание на то, что два последних объекта которые мы добавили без графического ресурса. По умолчанию, создаваемые на сцене объекты имеют размер 100х100 пикселей. Увеличим размер таблицы по высоте до 450 пикселей и перетащим ее влево, поместив над объектом panel_down.<br />
<br />
[[Файл:Lesson8_5.jpg]]<br />
<br />
Кнопку поместим в левый нижний угол. Добиваемся такого расположения объектов, как показанно на рисунке.<br />
<br />
[[Файл:Lesson8_6.jpg]]<br />
<br />
5. Настроим наши объекты. Для кнопки btb_replay_normal в поле "перейти на" укажите текущий экран Lesson_8.2.<br />
<br />
<br />
[[Файл:правка_намба_1.png|200px]]<br />
<br />
<br />
Для таблицы измените следующие параметры<br />
<br />
[[Файл:lesson8_table_setup.png|200px]]<br />
<br />
<br />
Для Patchwork устанавливаем следующие настройки. Обратите внимание, что поля "карт.спереди" и "шаблон" заполняются перетаскиванием графического ресурса из редактора ресурсов.<br />
<br />
[[Файл:Lesson8_9.jpg]]<br />
<br />
6. Для корректной работы вашего Patchwork необходимо, чтобы таблица находилась выше Patchwork по дереву объектов.<br />
<br />
[[Файл:Lesson8_10.jpg]]<br />
<br />
<br />
7. Проверьте выполнение задачи с помощью проигрывателя сцен Viewer.<br />
<br />
[[Файл:Lesson8.3.Fin.png]]<br />
<br />
=== Упражнения ===<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_08.2, создать новый экран Lesson_08.3<br />
<br />
2. Создать новую сцену с названием game.<br />
<br />
3. Скопировать все объекты из сцены 08 (экрана Lesson_08.2).<br />
<br />
4. Вставить скопированые объекты в новую сцену game (экрана Lesson_08.3).<br />
<br />
5. В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) заменить картинку пэчворка и маски на другую, имеющуюся в базе ресурсов;<br />
<br />
b) изменить настройки кнопки рестарта таким образом, чтобы не переходить на экран Lesson_08.3, а сразу передавать пэчворку состояние mix.<br />
----<br />
{| width="100%" <br />
| width="40%"|[[Создание игры «Hidden Object Game»|Урок 7]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Работа с эффектами|Урок 9]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:809.PNG&diff=9844Файл:809.PNG2019-07-30T12:09:57Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:809.png&diff=9843Файл:809.png2019-07-30T12:08:27Z<p>Apolozova: Apolozova загрузил новую версию Файл:809.png</p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:816.png&diff=9842Файл:816.png2019-07-30T11:46:54Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:815.png&diff=9841Файл:815.png2019-07-30T11:34:06Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:814.png&diff=9840Файл:814.png2019-07-30T11:32:56Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:813.png&diff=9839Файл:813.png2019-07-30T11:26:54Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:812.png&diff=9838Файл:812.png2019-07-30T11:22:15Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:811.png&diff=9837Файл:811.png2019-07-30T11:21:26Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:810.png&diff=9836Файл:810.png2019-07-30T11:20:43Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:809.png&diff=9835Файл:809.png2019-07-30T11:20:27Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:808.png&diff=9834Файл:808.png2019-07-30T11:18:02Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:807.png&diff=9833Файл:807.png2019-07-30T11:02:18Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0_%D0%BC%D0%B8%D0%BD%D0%B8%D0%B8%D0%B3%D1%80&diff=9832Настройка миниигр2019-07-30T11:00:48Z<p>Apolozova: /* Настройка объектов, создание машин состояний */</p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Создание игры «Hidden Object Game»|Урок 7]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Работа с эффектами|Урок 9]]<br />
|}<br />
----<br />
{{TOC right}}<br />
<br />
'''Цель:''' изучить настройки объектов, реализующих различные минигры.<br />
<br />
'''Задачи:''' <br />
* создать уровень игры с объектом, содержащим тип механики Puzzle<br />
* создать уровень игры с объектом, содержащим тип механики Patchwork <br />
<br />
== Puzzle ==<br />
<br />
=== Создание экрана и сцены в игровом проекте ===<br />
<br />
Запускаем SceneEditor. Открываем наш учебный проект lessons.seproj.<br />
<br />
Создаём экран lesson_8, а в нём сцены 08 и Buttons (стараемся делать это по памяти или подсматриваем в прошлых уроках), куда добавляем необходимые графические ресурсы из папки этого урока в Resources Editor: в экран 08 отправляем картинку level_01 (наш будущий пазл), а в Buttons (думаю, уже догадались) - будущие кнопки - hint_normal и ico_r_normal2. <br />
<br />
На экране кнопочкам подбираем симпатичное и удобное расположение.<br />
<br />
<br />
[[Файл:801.png]]<br />
<br />
=== Настройка объектов, создание машин состояний ===<br />
<br />
Меняем тип картинки '''level_01''' с '''image''' на [[Puzzle|puzzle]] (в папке Game mechanic) и устанавливаем следующие настройки:<br />
<br />
[[Файл:802.png]]<br />
<br />
В сцене '''08''' создаём ещё один объект. Даём ему имя '''applause''', тип '''machine''' (прописываем 2 состояния '''on''' и '''off'''). <br />
<br />
В состоянии '''on''' добавляем команду '''play''' (проиграть звук) и в списке выбираем '''snd''' (короткий звук), который подгружаем с помощью базы ресурсов (если подходящего звукового файла в уроке не обнаружилось, его необходимо добавить самостоятельно). <br />
<br />
Возвращаемся к общим настройкам и устанавливаем стартовое состояние '''off'''. <br />
<br />
[[Файл:803.png]]<br />
<br />
Переходим к сцене '''Buttons''' и меняем тип обоих графических файлов на '''button'''. Общий вид лейаута на этом этапе получится примерно следующий:<br />
<br />
[[Файл:804.png]] <br />
<br />
В настройках кнопок перетянем из базы ресурсов картинки с внешним видом нажатых и отжатых кнопок.<br />
<br />
[[Файл:805.png]] <br />
<br />
Кнопка '''R''' (переиграть) — кнопка, запускающая игру Puzzle сначала. <br />
<br />
Нам необходимо, чтобы кнопка '''R''' перемешивала части нашего пазла. Для этого в настройках кликаем правой кнопкой мыши и выбираем '''клик:изменить состояние объекта'''. В появившейся в настройках вкладке выбираем в качестве объекта наш пазл ('''level_01''') и состояние '''mix''', которое перемешает части исходной картинки.<br />
<br />
[[Файл:806.png]] <br />
<br />
Пусть кнопка '''hint''' (подсказка) по клику показывает нам картинку в собранном виде. Для этого повторяем процедуру с добавлением настройки '''клик:изменить состояние объекта''', только теперь для кнопки '''hint'''. Выбираем объектом наш '''level_01''' и состояние для него '''hint'''. <br />
<br />
<pre><br />
На заметку. Если возникает необходимость добавить 2 и более настройки при помощи правой кнопки мыши, <br />
то лучше из кнопки сделать машину состояний и все состояния создать уже там.<br />
</pre><br />
<br />
Любуемся результатом своих стараний, сохранив проект и запустив его с помощью Viewer`а.<br />
<br />
=== Упражнения ===<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_08, создать новый экран Lesson_08.1<br />
<br />
2. Создать новые сцены (с названием 08.1 и Buttons).<br />
<br />
3. Скопировать все объекты из сцены 08 (экрана Lesson_08) и Buttons (экрана Lesson_08).<br />
<br />
4. Вставить скопированые объекты в новую сцену 08.1 и Buttons (экрана Lesson_08.1).<br />
<br />
[[Файл:08 15.png]]<br />
<br />
5. В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) заменить звук аплодисментов другим аудиофайлом, имеющимся в базе ресурсов;<br />
<br />
b) в пазле изменить количество разбиваемых частей на шесть (3х2), добавить сетку, изменить перестановку ячеек на смешивание по alpha, изменить время смешивания на 500 миллисекунд;<br />
<br />
c) при нажатии hint (подсказки) изменить время показа подсказки на 2 секунды, изменить время финального показа пазла на 3 секунды, установить время закрытия пазла 500 миллисекунд.<br />
<br />
6. Сделать счетчик подсказок, используя объект '''[[Store|Store]]''' создать возможность совершать покупки подсказок за реальные деньги. Использовать для открытия окна покупки подсказки объект '''[[Statesmanager]]'''<br />
<br />
Щелкнув правой кнопкой мыши по экрану Lesson_08.1 создадим новый экран '''lessons_8_1_1'''. Добавим в него сцены str_8_1 и Button_8_1. В сцену str_8_1 поместим объекты из экрана Lesson_08.1: level_01, applause; оставим их без изменения. В сцену Button_8_1 скопируем из Lesson_08.1 кнопки hint_normal и ico_R_normal2 и создадим новый объект, поменяв ему тип на '''counter''' (счетчик) и названия на '''hint'''. Добавим ресурс из базы ресурсов — анимацию file1 (brown_big). Счетчик hint будет считывать купленные подсказки.<br />
<br />
[[Файл:Hint counter na max.png]]<br />
<br />
В hint_normal добавим подобъект, сделаем его машиной и назовем '''hint_m'''.<br />
<br />
Щелкнув правой кнопкой мыши на сцену Button_8_1 создадим новые сцены store и error, которые, соответственно, будут предназначены для совершения покупок — начисления подсказок и окна с ошибкой при невозможности купить подсказку.<br />
<br />
В сцену store добавим две машины: '''buy''' и '''store'''; в error - машину '''error'''.<br />
<br />
[[Файл:8 1 1 .PNG]]<br />
<br />
Для машины buy зададим состояния, при котором значении параметра hint=1, то есть она начисляет подсказку:<br />
<br />
[[Файл:Buy na max.png]]<br />
<br />
Соответственно в машине store зададим считывания со счетчика и прозрачность экрана:<br />
<br />
[[Файл:Store.PNG]]<br />
<br />
Машина error будет отвечать за вывод ошибки при неудачной покупке, то есть задает прозрачность экрана с ошибкой<br />
<br />
[[Файл:Error.PNG]]<br />
<br />
Вернемся к машине hint_m сцены Button_8_1 и пропишем для нее состояния. Машина отвечает за начисление подсказки при удачной покупке<br />
<br />
[[Файл:Hint m.PNG|800px]]<br />
<br />
Для того, что бы вызывать машину hint_m в нашей игре, откроем кнопку hint_normal и в свойстве "изменить состояние объекта" в качестве объекта выберем машину hint_m, и пропишем ей состояние check.<br />
<br />
'''Совершение покупки'''<br />
<br />
Для того что бы покупку можно было совершить необходимо задать в глобальных свойствах возможность совершения покупки. Для этого на сцене в глобальном экране opt добавим новый элемент, которому изменим тип на store. В свойствах объекта store кликнем правой кнопкой мыши на свойстве wallet, вставляем новое свойство — '''in-app покупка'''. Добавляем поля для покупки: внутренний id, и выбираем расходуемая.<br />
<br />
[[Файл:Store2.PNG]]<br />
<br />
<br />
'''Описание объекта Store'''<br />
<br />
Объект '''Store''' необходим для описания InApp покупок (позволяют продавать отдельные бонусы, паки и т.п.) в игре.<br />
<br />
Основные параметры объекта Store<br />
<br />
''id покупки'' – внутренний id покупки.<br />
<br />
''Расходуемая'' – 1 – покупка расходуемая, 0 – покупка раз и навсегда, если параметр не указан, по-умолчанию покупка – одноразовая.<br />
<br />
''объект (restore)'' – объект - Слушатель восстановления покупки. Этому объекту будет сообщено об успехе восстановления этой покупки покупки.<br />
состояние (restore) – это состояние будет установлено объекту при успешном восстановлении этой покупки.<br />
<br />
'''Для того, чтобы объект Store работал во Вьювере, нужно подкорректировать файл app.icf'''<br />
<br />
1. Найти файл app.icf в папке с вашим проектом.<br />
<br />
2. Открыть его и найти тег [Game].<br />
<br />
3. В теге Game добавить строку purchaseEverything=1.<br />
<br />
4. Сохранить файл<br />
<br />
<pre><br />
<br />
[Game]<br />
purchaseEverything=1<br />
DispFixRot="Landscape"<br />
# comments and whitespace stripped by deployment tool<br />
debug="Absolutist-2253"<br />
show_build_date=1<br />
AppTitle="Viewer"<br />
DebuggerIP="127.0.0.1"<br />
DebuggerPort=5322<br />
<br />
</pre><br />
<br />
<br />
<br />
'''Оформление'''<br />
<br />
Теперь перейдем к оформлению. Для того что бы на экране появлялось окно с предложением о покупке подсказке необходимо его создать. В начальный момент оно должно быть невидимым и прокликиваем, это состояние задано в машине store. Создадим в ней 5 подобъектов.<br />
<br />
<br />
1.1. Первые два переименуем в '''black''' и '''rec''', изменим им тип на '''[[Rectangle|Rectangle]]'''.<br />
<br />
Откроем объект black, пропишем ему свойствах, оставив его пустым рамку, и цвет фона<br />
<br />
[[Файл:Black.PNG]]<br />
<br />
Для объекта rec зададим рамку и текстуру заливки. Для этого из базы ресурсов мышкой перетащим соответствующие элементы. Ресурсы для графики находятся в предыдущем уроке. Чтобы прямоугольник отображался правильно, задайте ему ненулевые размеры.<br />
<br />
[[Файл:Rec.PNG]]<br />
<br />
Чтобы прямоугольник отображался правильно, задайте ему ненулевые параметры размера.<br />
<br />
1.2. Третьему элементу поменяем тип на text с текстом<br />
<br />
[[Файл:Text.PNG]]<br />
<br />
<br />
1.3. Четвертый и пятый объекты сделаем кнопками, и назовем их '''ok''' – купить подсказку, '''no''' – отказаться от покупки. <br />
<br />
Для кнопки ok из базы ресурсов выберем внешний вид<br />
<br />
[[Файл:Ok1.PNG]]<br />
<br />
и зададим переход на совершение или провал покупки. Для этого кликнем правой кнопкой мыши на свойстве позиционирование и добавим свойство совершить in-app покупку, заполним для нее поля как указано на картинки<br />
<br />
[[Файл:Ok2.PNG]]<br />
<br />
Аналогично поступим с кнопкой no. Добавим графический ресурс и свойство «изменить состояние объекта», которое будет закрывать окно с предложением о покупке<br />
<br />
[[Файл:No1.PNG]] [[Файл:No2.PNG]]<br />
<br />
<br />
2. Так же сделаем со сценой error. В ней создадим четыре объекта: два rectangle: '''rec_error''' – пустой, '''black_error''' — оформленный в такую же рамку; кнопку '''buy''', которая будет делать активным состояние error; текстовый объект '''text_error''' с текстом «error!»<br />
<br />
[[Файл:Buy1.PNG]]<br />
<br />
Разместим все объекты так, что бы картинка хорошо смотрелась. Сохраним все изменения и запустим вьювер. <br />
<br />
[[Файл:Снимок1.PNG]] <br />
<br />
Сейчас при покупке подсказки количество покупок не имеет лимита, по этому вывод ошибки мы не получим. Этот параметр в реальной игре будет реализован с помощью объекта store, заданием ему соответствующих свойств.<br />
<br />
== Patchwork ==<br />
<br />
=== Создание экрана и сцены в игровом проекте ===<br />
<br />
1. Запустить SceneEditor.<br />
<br />
2. В меню Проект → Загрузить → Learning.seproj. <br />
<br />
3. Кликнув правой кнопкой мыши по ранее созданному экрану Lesson_08.1, создать экран Lesson_08.2.<br />
<br />
[[Файл:Lesson8_1.jpg|right]]<br />
<br />
4. В экране Lesson_08.2 создать новую сцену 08, в которую (через ResourcesEditor) добавить графические ресурсы (bg_game, panel_down, btb_replay_normal) из папки Sources\Lesson_08 (см. подготовка к работе «Создание проекта»). В редактор ресурсов добавить графику нашего будущего Patchwork: level_17, level_17_mask.<br />
<br />
=== Настройка объектов ===<br />
<br />
1. Создадим на сцене 08 еще два объекта. Для этого нажмем правой кнопкой мыши по сцене и выберем "Создать объект в текущем элементе".<br />
<br />
[[Файл:Lesson8_2.jpg]]<br />
<br />
2. Переименуем один из созданных объектов в Patchwork, а другой в table.<br />
<br />
[[Файл:Lesson8_3.jpg]]<br />
<br />
[[Файл:Lesson8_4.jpg|right]]<br />
<br />
3. Теперь будем изменять тип объектов на сцене, чтобы получить нужные нам элементы. Графические ресурсы bg_game и panel_down оставляем без изменений. Ресурсу btb_replay_normal изменяем тип на button. Объекту Patchwork меняем тип на patchwork, table изменяем на тип table.<br />
4. Теперь объекты нужно разместить на сцене. Обратим внимание на то, что два последних объекта которые мы добавили без графического ресурса. По умолчанию, создаваемые на сцене объекты имеют размер 100х100 пикселей. Увеличим размер таблицы по высоте до 450 пикселей и перетащим ее влево, поместив над объектом panel_down.<br />
<br />
[[Файл:Lesson8_5.jpg]]<br />
<br />
Кнопку поместим в левый нижний угол. Добиваемся такого расположения объектов, как показанно на рисунке.<br />
<br />
[[Файл:Lesson8_6.jpg]]<br />
<br />
5. Настроим наши объекты. Для кнопки btb_replay_normal в поле "перейти на" укажите текущий экран Lesson_8.2.<br />
<br />
<br />
[[Файл:правка_намба_1.png|200px]]<br />
<br />
<br />
Для таблицы измените следующие параметры<br />
<br />
[[Файл:lesson8_table_setup.png|200px]]<br />
<br />
<br />
Для Patchwork устанавливаем следующие настройки. Обратите внимание, что поля "карт.спереди" и "шаблон" заполняются перетаскиванием графического ресурса из редактора ресурсов.<br />
<br />
[[Файл:Lesson8_9.jpg]]<br />
<br />
6. Для корректной работы вашего Patchwork необходимо, чтобы таблица находилась выше Patchwork по дереву объектов.<br />
<br />
[[Файл:Lesson8_10.jpg]]<br />
<br />
<br />
7. Проверьте выполнение задачи с помощью проигрывателя сцен Viewer.<br />
<br />
[[Файл:Lesson8.3.Fin.png]]<br />
<br />
=== Упражнения ===<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_08.2, создать новый экран Lesson_08.3<br />
<br />
2. Создать новую сцену с названием game.<br />
<br />
3. Скопировать все объекты из сцены 08 (экрана Lesson_08.2).<br />
<br />
4. Вставить скопированые объекты в новую сцену game (экрана Lesson_08.3).<br />
<br />
5. В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) заменить картинку пэчворка и маски на другую, имеющуюся в базе ресурсов;<br />
<br />
b) изменить настройки кнопки рестарта таким образом, чтобы не переходить на экран Lesson_08.3, а сразу передавать пэчворку состояние mix.<br />
----<br />
{| width="100%" <br />
| width="40%"|[[Создание игры «Hidden Object Game»|Урок 7]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Работа с эффектами|Урок 9]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:806.png&diff=9831Файл:806.png2019-07-30T10:44:33Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:805.png&diff=9830Файл:805.png2019-07-30T10:39:54Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:804.png&diff=9829Файл:804.png2019-07-30T10:38:27Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:803.png&diff=9828Файл:803.png2019-07-30T10:35:41Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0_%D0%BC%D0%B8%D0%BD%D0%B8%D0%B8%D0%B3%D1%80&diff=9827Настройка миниигр2019-07-30T10:31:30Z<p>Apolozova: /* Создание экрана и сцены в игровом проекте */</p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Создание игры «Hidden Object Game»|Урок 7]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Работа с эффектами|Урок 9]]<br />
|}<br />
----<br />
{{TOC right}}<br />
<br />
'''Цель:''' изучить настройки объектов, реализующих различные минигры.<br />
<br />
'''Задачи:''' <br />
* создать уровень игры с объектом, содержащим тип механики Puzzle<br />
* создать уровень игры с объектом, содержащим тип механики Patchwork <br />
<br />
== Puzzle ==<br />
<br />
=== Создание экрана и сцены в игровом проекте ===<br />
<br />
Запускаем SceneEditor. Открываем наш учебный проект lessons.seproj.<br />
<br />
Создаём экран lesson_8, а в нём сцены 08 и Buttons (стараемся делать это по памяти или подсматриваем в прошлых уроках), куда добавляем необходимые графические ресурсы из папки этого урока в Resources Editor: в экран 08 отправляем картинку level_01 (наш будущий пазл), а в Buttons (думаю, уже догадались) - будущие кнопки - hint_normal и ico_r_normal2. <br />
<br />
На экране кнопочкам подбираем симпатичное и удобное расположение.<br />
<br />
<br />
[[Файл:801.png]]<br />
<br />
=== Настройка объектов, создание машин состояний ===<br />
<br />
1. В сцене 08 изменить название графического ресурса hint_normal на applause и в общих настройках элемента удалить саму графику через модификаторы → res.<br />
<br />
[[Файл:08 4.png]]<br />
<br />
2. Графическое изображение level_01 перевести в тип [[Puzzle|puzzle]] и установить такие настройки:<br />
<br />
[[Файл:08 5.png]]<br />
<br />
3. Объект applause перевести в тип машина и прописать ему состояния on и off.<br />
<br />
4. В состоянии on добавить команду play (проиграть звук) и в списке команды выбрать snd (короткий звук), подгружаемый с помощью ResourcesEditor из папки ресурсов Level_08; <br />
<br />
[[Файл:08 6.png]]<br />
<br />
5. Создать новое состояние с именем off. В общих настройка свойства элемента изначально установить состояние off.<br />
<br />
[[Файл:08 7.png]] [[Файл:08 8.png]]<br />
<br />
6. Далее перейти к сцене Buttons, перевести графические объекты hint_normal, ico_R_normal2 в тип button, в свойстве элемента установить такие настройки:<br />
<br />
[[Файл:08 9.png]] [[Файл:08 10.png]]<br />
<br />
''Кнопка R (переиграть)'' — кнопка, запускающая игру Puzzle сначала. В общих настройках свойства элемента устанавливаем, в какое начало должна возвращать кнопка (в нашем случае перейти на экран Lesson_08).Для данной игры, мы сделали переход на экран <tt>Lesson_08</tt>, который запускает игру сначала. Но в дальнейшем, чтобы не переводить все объекты в начальное состояние правильнее будет, в графе '''«изменить состояние»''' выбрать объект <tt>Level_01</tt> и указать ему состояние <tt>mix</tt>, которое означает, что игра возвращается в состояние перемешивания картинок, а не запускает всю игру заново.<br />
<br />
7. В объекте (кнопке) hint_normal нажать правой кнопкой и выбрать изменить состояние объекта → потом выбрать объект level_01 и вписать состояние hint, которое означает, что при нажатии кнопки, в качестве подсказки, игра покажет картинку в собранном виде.<br />
<br />
[[Файл:08 11.png]] [[Файл:08 12.png]]<br />
<br />
''hint'' – кнопка, реализующая подсказку на экране поиска.<br />
<br />
8. Вернуться на сцену 08 к объекту level_01 и в общих настройках свойства элемента изменить состояние объекта → выбрать объект applause и вписать состояние on.<br />
<br />
[[Файл:08 13.png]]<br />
<br />
9. Проверить выполнение задачи с помощью проигрывателя сцен Viewer.<br />
<br />
=== Упражнения ===<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_08, создать новый экран Lesson_08.1<br />
<br />
2. Создать новые сцены (с названием 08.1 и Buttons).<br />
<br />
3. Скопировать все объекты из сцены 08 (экрана Lesson_08) и Buttons (экрана Lesson_08).<br />
<br />
4. Вставить скопированые объекты в новую сцену 08.1 и Buttons (экрана Lesson_08.1).<br />
<br />
[[Файл:08 15.png]]<br />
<br />
5. В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) заменить звук аплодисментов другим аудиофайлом, имеющимся в базе ресурсов;<br />
<br />
b) в пазле изменить количество разбиваемых частей на шесть (3х2), добавить сетку, изменить перестановку ячеек на смешивание по alpha, изменить время смешивания на 500 миллисекунд;<br />
<br />
c) при нажатии hint (подсказки) изменить время показа подсказки на 2 секунды, изменить время финального показа пазла на 3 секунды, установить время закрытия пазла 500 миллисекунд.<br />
<br />
6. Сделать счетчик подсказок, используя объект '''[[Store|Store]]''' создать возможность совершать покупки подсказок за реальные деньги. Использовать для открытия окна покупки подсказки объект '''[[Statesmanager]]'''<br />
<br />
Щелкнув правой кнопкой мыши по экрану Lesson_08.1 создадим новый экран '''lessons_8_1_1'''. Добавим в него сцены str_8_1 и Button_8_1. В сцену str_8_1 поместим объекты из экрана Lesson_08.1: level_01, applause; оставим их без изменения. В сцену Button_8_1 скопируем из Lesson_08.1 кнопки hint_normal и ico_R_normal2 и создадим новый объект, поменяв ему тип на '''counter''' (счетчик) и названия на '''hint'''. Добавим ресурс из базы ресурсов — анимацию file1 (brown_big). Счетчик hint будет считывать купленные подсказки.<br />
<br />
[[Файл:Hint counter na max.png]]<br />
<br />
В hint_normal добавим подобъект, сделаем его машиной и назовем '''hint_m'''.<br />
<br />
Щелкнув правой кнопкой мыши на сцену Button_8_1 создадим новые сцены store и error, которые, соответственно, будут предназначены для совершения покупок — начисления подсказок и окна с ошибкой при невозможности купить подсказку.<br />
<br />
В сцену store добавим две машины: '''buy''' и '''store'''; в error - машину '''error'''.<br />
<br />
[[Файл:8 1 1 .PNG]]<br />
<br />
Для машины buy зададим состояния, при котором значении параметра hint=1, то есть она начисляет подсказку:<br />
<br />
[[Файл:Buy na max.png]]<br />
<br />
Соответственно в машине store зададим считывания со счетчика и прозрачность экрана:<br />
<br />
[[Файл:Store.PNG]]<br />
<br />
Машина error будет отвечать за вывод ошибки при неудачной покупке, то есть задает прозрачность экрана с ошибкой<br />
<br />
[[Файл:Error.PNG]]<br />
<br />
Вернемся к машине hint_m сцены Button_8_1 и пропишем для нее состояния. Машина отвечает за начисление подсказки при удачной покупке<br />
<br />
[[Файл:Hint m.PNG|800px]]<br />
<br />
Для того, что бы вызывать машину hint_m в нашей игре, откроем кнопку hint_normal и в свойстве "изменить состояние объекта" в качестве объекта выберем машину hint_m, и пропишем ей состояние check.<br />
<br />
'''Совершение покупки'''<br />
<br />
Для того что бы покупку можно было совершить необходимо задать в глобальных свойствах возможность совершения покупки. Для этого на сцене в глобальном экране opt добавим новый элемент, которому изменим тип на store. В свойствах объекта store кликнем правой кнопкой мыши на свойстве wallet, вставляем новое свойство — '''in-app покупка'''. Добавляем поля для покупки: внутренний id, и выбираем расходуемая.<br />
<br />
[[Файл:Store2.PNG]]<br />
<br />
<br />
'''Описание объекта Store'''<br />
<br />
Объект '''Store''' необходим для описания InApp покупок (позволяют продавать отдельные бонусы, паки и т.п.) в игре.<br />
<br />
Основные параметры объекта Store<br />
<br />
''id покупки'' – внутренний id покупки.<br />
<br />
''Расходуемая'' – 1 – покупка расходуемая, 0 – покупка раз и навсегда, если параметр не указан, по-умолчанию покупка – одноразовая.<br />
<br />
''объект (restore)'' – объект - Слушатель восстановления покупки. Этому объекту будет сообщено об успехе восстановления этой покупки покупки.<br />
состояние (restore) – это состояние будет установлено объекту при успешном восстановлении этой покупки.<br />
<br />
'''Для того, чтобы объект Store работал во Вьювере, нужно подкорректировать файл app.icf'''<br />
<br />
1. Найти файл app.icf в папке с вашим проектом.<br />
<br />
2. Открыть его и найти тег [Game].<br />
<br />
3. В теге Game добавить строку purchaseEverything=1.<br />
<br />
4. Сохранить файл<br />
<br />
<pre><br />
<br />
[Game]<br />
purchaseEverything=1<br />
DispFixRot="Landscape"<br />
# comments and whitespace stripped by deployment tool<br />
debug="Absolutist-2253"<br />
show_build_date=1<br />
AppTitle="Viewer"<br />
DebuggerIP="127.0.0.1"<br />
DebuggerPort=5322<br />
<br />
</pre><br />
<br />
<br />
<br />
'''Оформление'''<br />
<br />
Теперь перейдем к оформлению. Для того что бы на экране появлялось окно с предложением о покупке подсказке необходимо его создать. В начальный момент оно должно быть невидимым и прокликиваем, это состояние задано в машине store. Создадим в ней 5 подобъектов.<br />
<br />
<br />
1.1. Первые два переименуем в '''black''' и '''rec''', изменим им тип на '''[[Rectangle|Rectangle]]'''.<br />
<br />
Откроем объект black, пропишем ему свойствах, оставив его пустым рамку, и цвет фона<br />
<br />
[[Файл:Black.PNG]]<br />
<br />
Для объекта rec зададим рамку и текстуру заливки. Для этого из базы ресурсов мышкой перетащим соответствующие элементы. Ресурсы для графики находятся в предыдущем уроке. Чтобы прямоугольник отображался правильно, задайте ему ненулевые размеры.<br />
<br />
[[Файл:Rec.PNG]]<br />
<br />
Чтобы прямоугольник отображался правильно, задайте ему ненулевые параметры размера.<br />
<br />
1.2. Третьему элементу поменяем тип на text с текстом<br />
<br />
[[Файл:Text.PNG]]<br />
<br />
<br />
1.3. Четвертый и пятый объекты сделаем кнопками, и назовем их '''ok''' – купить подсказку, '''no''' – отказаться от покупки. <br />
<br />
Для кнопки ok из базы ресурсов выберем внешний вид<br />
<br />
[[Файл:Ok1.PNG]]<br />
<br />
и зададим переход на совершение или провал покупки. Для этого кликнем правой кнопкой мыши на свойстве позиционирование и добавим свойство совершить in-app покупку, заполним для нее поля как указано на картинки<br />
<br />
[[Файл:Ok2.PNG]]<br />
<br />
Аналогично поступим с кнопкой no. Добавим графический ресурс и свойство «изменить состояние объекта», которое будет закрывать окно с предложением о покупке<br />
<br />
[[Файл:No1.PNG]] [[Файл:No2.PNG]]<br />
<br />
<br />
2. Так же сделаем со сценой error. В ней создадим четыре объекта: два rectangle: '''rec_error''' – пустой, '''black_error''' — оформленный в такую же рамку; кнопку '''buy''', которая будет делать активным состояние error; текстовый объект '''text_error''' с текстом «error!»<br />
<br />
[[Файл:Buy1.PNG]]<br />
<br />
Разместим все объекты так, что бы картинка хорошо смотрелась. Сохраним все изменения и запустим вьювер. <br />
<br />
[[Файл:Снимок1.PNG]] <br />
<br />
Сейчас при покупке подсказки количество покупок не имеет лимита, по этому вывод ошибки мы не получим. Этот параметр в реальной игре будет реализован с помощью объекта store, заданием ему соответствующих свойств.<br />
<br />
== Patchwork ==<br />
<br />
=== Создание экрана и сцены в игровом проекте ===<br />
<br />
1. Запустить SceneEditor.<br />
<br />
2. В меню Проект → Загрузить → Learning.seproj. <br />
<br />
3. Кликнув правой кнопкой мыши по ранее созданному экрану Lesson_08.1, создать экран Lesson_08.2.<br />
<br />
[[Файл:Lesson8_1.jpg|right]]<br />
<br />
4. В экране Lesson_08.2 создать новую сцену 08, в которую (через ResourcesEditor) добавить графические ресурсы (bg_game, panel_down, btb_replay_normal) из папки Sources\Lesson_08 (см. подготовка к работе «Создание проекта»). В редактор ресурсов добавить графику нашего будущего Patchwork: level_17, level_17_mask.<br />
<br />
=== Настройка объектов ===<br />
<br />
1. Создадим на сцене 08 еще два объекта. Для этого нажмем правой кнопкой мыши по сцене и выберем "Создать объект в текущем элементе".<br />
<br />
[[Файл:Lesson8_2.jpg]]<br />
<br />
2. Переименуем один из созданных объектов в Patchwork, а другой в table.<br />
<br />
[[Файл:Lesson8_3.jpg]]<br />
<br />
[[Файл:Lesson8_4.jpg|right]]<br />
<br />
3. Теперь будем изменять тип объектов на сцене, чтобы получить нужные нам элементы. Графические ресурсы bg_game и panel_down оставляем без изменений. Ресурсу btb_replay_normal изменяем тип на button. Объекту Patchwork меняем тип на patchwork, table изменяем на тип table.<br />
4. Теперь объекты нужно разместить на сцене. Обратим внимание на то, что два последних объекта которые мы добавили без графического ресурса. По умолчанию, создаваемые на сцене объекты имеют размер 100х100 пикселей. Увеличим размер таблицы по высоте до 450 пикселей и перетащим ее влево, поместив над объектом panel_down.<br />
<br />
[[Файл:Lesson8_5.jpg]]<br />
<br />
Кнопку поместим в левый нижний угол. Добиваемся такого расположения объектов, как показанно на рисунке.<br />
<br />
[[Файл:Lesson8_6.jpg]]<br />
<br />
5. Настроим наши объекты. Для кнопки btb_replay_normal в поле "перейти на" укажите текущий экран Lesson_8.2.<br />
<br />
<br />
[[Файл:правка_намба_1.png|200px]]<br />
<br />
<br />
Для таблицы измените следующие параметры<br />
<br />
[[Файл:lesson8_table_setup.png|200px]]<br />
<br />
<br />
Для Patchwork устанавливаем следующие настройки. Обратите внимание, что поля "карт.спереди" и "шаблон" заполняются перетаскиванием графического ресурса из редактора ресурсов.<br />
<br />
[[Файл:Lesson8_9.jpg]]<br />
<br />
6. Для корректной работы вашего Patchwork необходимо, чтобы таблица находилась выше Patchwork по дереву объектов.<br />
<br />
[[Файл:Lesson8_10.jpg]]<br />
<br />
<br />
7. Проверьте выполнение задачи с помощью проигрывателя сцен Viewer.<br />
<br />
[[Файл:Lesson8.3.Fin.png]]<br />
<br />
=== Упражнения ===<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_08.2, создать новый экран Lesson_08.3<br />
<br />
2. Создать новую сцену с названием game.<br />
<br />
3. Скопировать все объекты из сцены 08 (экрана Lesson_08.2).<br />
<br />
4. Вставить скопированые объекты в новую сцену game (экрана Lesson_08.3).<br />
<br />
5. В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) заменить картинку пэчворка и маски на другую, имеющуюся в базе ресурсов;<br />
<br />
b) изменить настройки кнопки рестарта таким образом, чтобы не переходить на экран Lesson_08.3, а сразу передавать пэчворку состояние mix.<br />
----<br />
{| width="100%" <br />
| width="40%"|[[Создание игры «Hidden Object Game»|Урок 7]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Работа с эффектами|Урок 9]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:802.png&diff=9826Файл:802.png2019-07-30T10:29:06Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A4%D0%B0%D0%B9%D0%BB:801.png&diff=9825Файл:801.png2019-07-30T10:18:55Z<p>Apolozova: </p>
<hr />
<div></div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=Flyer&diff=9824Flyer2019-07-29T11:33:31Z<p>Apolozova: /* Состояния */</p>
<hr />
<div>[[Файл:flyer_fountain_property.JPG|right]]<br />
<br />
'''Flyers '''(флаеры, партиклы)- летающие картинки, при помощи этого [[Object|объекта]] можно реализовывать различные эффекты: взрывы, падающие снежинки, дождь, фонтан, огонь, летающая пыль, дым, пар и т.п.<br />
<br />
== Общие параметры ==<br />
<br />
(см. описание [[Object|Object]])<br />
*'''имя''' - Имя объекта Flyer в дереве проекта. Может быт произвольным.<br />
*'''id-объекта''' - Уникальный номер объекта Flyer, который можно увидеть при наведении курсора на строку "имя".<br />
*'''синхронизация''' - Применяется для синхронизации между лейаутами. Если указан параметр "нет", то объект будет активен только на текущем лейауте. По умолчанию указан параметр "да". <br />
*'''сохранение параметров''' - Настройка этого параметра актуальна, если приложение в дальнейшем будет сворачиваться в системную панель («трей»). Выбирается значение этого параметра из выпадающего списка. Возможны следующие варианты: "нет", "только объект", "объект с подобъектами", "только подобъекты". При выходе из трэя будут восстановлены ранее измененные/установленные (при переходе с одного экрана на другой)параметры объектов или подобъектов в зависимости от выбранного варианта для этого параметра. По умолчанию указан параметр "нет". Следует помнить, что если выбирается для объекта некоторой сцены значения этого параметра отличное от "нет", то должно и предусматриваться соответствующее значение этого параметра и для этой сцены, и для экрана, содержащего эту сцену.<br />
*'''z''' - Параметр порядка рисования объекта. Сначала рисуются объекты с большим z, затем, поверх них - с меньшим.<br />
*'''память''' - Если 1, то при повторном открытии экрана объект не обновляет свои параметры (помнит текущие параметры, оставшиеся от предыдущего посещения экрана). По умолчанию значение этого параметра 0.<br />
*'''тип''' - Тип флаера. Определяет его функциональное назначение и его свойства. Для флаера возможны следующие типы: "картинки", "текст". Выбирается подходящий тип из выпадающего списка. По умолчанию указан тип "картинки".<br />
<br />
== Основные параметры ==<br />
<br />
'''Группа - внешний вид'''<br />
<br />
*'''картинка''' - Служит для рисования флаера в случае выбора типа флаера "картинки" В поле этого параметра находится имя графического ресурса (частицы), перетаскиваемого мышкой из редактора ресурсов (поле должно быть в состоянии редактирования). <br />
*'''текст''' - Служит для рисования флаера в случае выбора типа флаера "текст". <br />
<br />
При выборе типа флаера "картинки" параметр "текст" игнорируется и наоборот. Вместе текст и картинка не существуют.<br />
<br />
<br />
'''Группа - шрифт'''<br />
<br />
Служит для настройки внешнего вида текста в случае выбора типа флаера "текст".<br />
*'''имя''' - Номер шрифта - целое число, начиная с 0 (порядковый номер шрифта). <br />
*'''размер''' - Размер шрифта в пикселях. <br />
*'''цвет''' - Цвет шрифта.<br />
<br />
<br />
'''Группа - модификаторы'''<br />
<br />
*'''alpha''' ''(al)'' - Изменяет прозрачность используемого ресурса: от 0 (прозрачен) до 1 (не прозрачен).<br />
*'''blending''' ''(bl)'' - Alpha смешивание. Взаимодействие каждой новой частицы (source) с раннее отрисованными (dest). Значения данного параметра выбираются из выпадающего списка. Каждый отдельный цвет, который мы видим, создается с помощью комбинации трех цветов: красного (red), зеленого (green) и синего (blue). RGB - является их аббревиатурой . Разные значения модификатора "blending" отличаются способ вычисления значений RGB-каналов и значения прозрачности.<br />
<br />
''' blend ''' - смешивание.<br />
<br />
Rback = (Rsource * Ralpha) + (Rdest * (1 - Ralpha)) <br />
<br />
Gback = (Gsource * Galpha) + (Gdest * (1 - Galpha))<br />
<br />
Bback = (Bsource * Balpha) + (Bdest * (1 - Balpha)) <br />
<br />
Aback = (Asource * Aalpha) + (Adest * (1 - Aalpha))<br />
<br />
<br />
''' half ''' - деление пополам.<br />
<br />
Rback = (Rsource + Rdest) / 2 <br />
<br />
Gback = (Gsource + Gdest) / 2 <br />
<br />
Bback = (Bsource + Bdest) / 2 <br />
<br />
Aback = (Asource + Adest) / 2 <br />
<br />
<br />
''' add ''' - добавление.<br />
<br />
Rback = Rsource + Rdest <br />
<br />
Gback = Gsource + Gdest <br />
<br />
Bback = Bsource + Bdest <br />
<br />
Aback = Asource + Adest <br />
<br />
<br />
''' sub ''' - вычитание.<br />
<br />
Rback = Rsource - Rdest <br />
<br />
Gback = Gsource - Gdest <br />
<br />
Bback = Bsource - Bdest <br />
<br />
Aback = Asource - Adest <br />
<br />
<br />
''' none ''' - ничего не происходит.<br />
*'''angle''' ''(ang)'' - Изменяет угол наклона используемого ресурса. Отсчитывается по часовой стрелке. Против - отсчитываются отрицательные углы. <br />
*'''scaleX/scaleY''' ''(sx/sy)'' – Изменяют масштаб используемого ресурса, но при этом изменяет и положение точки рождения флаера, что делает использование данного модификатора крайне неудобным.<br />
<br />
Модификаторы становятся активными если установлен флаг «использовать модификаторы», в противном случае установленные параметры игнорируются.<br />
<br />
<br />
'''Группа - звуки'''<br />
<br />
*'''звук''' - Звук, который будет запущен при переходе партиклов в состояние beg. Перетаскивается правой кнопкой мышки из редактора ресурсов (поле должно быть в состоянии редактирования).<br />
*'''зациклить''' - Если 1, то звук будет зациклен. По умолчанию значение этого параметра 0.<br />
<br />
== Состояния ==<br />
<br />
*'''beg''' – Состояние в котором флаер начинает свой цикл жизни (включается).<br />
*'''end''' – Состояние которое выключает флаер.<br />
*'''stop_birth''' - Состояние заканчивает рождение. В по сути - "горшочек, не вари"<br />
*'''start_birth''' - Начать рождения частиц (по сути отмена состояния - "stop_birth");<br />
*'''pause''' - Заморозить частицы - частицы не меняют свои параметры, но при этом остаются видимыми;<br />
*'''run''' - Вернуть частицам рабочее состояние ( снятие состояния "pause");<br />
<br />
== Дополнительные параметры ==<br />
<br />
<br />
'''Область рождения'''<br />
<br />
*'''только контур''' ''(frame)'' - Если 1, то частицы будут рождаться только по контуру, описанному параметрами. Если 0, то по всей площади.<br />
*'''радиус r''' ''(r)'' - Радиус области вокруг (х,у), где рождаются летуны.<br />
*'''горизонтальная rx''' ''(rx)'' - Горизонтальная область рождения. Летуны будут рождаться внутри прямоугольника с шириной 2*rx.<br />
*'''вертикальная ry''' ''(ry)'' - Вертикальная область рождения. Летуны будут рождаться внутри прямоугольника с высотой 2*ry.<br />
<br />
Если все параметры области рождения равны нулю: r=rx=ry=0, то летуны будут рождаться из одной точки.<br />
Центр области рождения задается стандартными для всех объектов координатами x,y из раздела "положение". Круг имеет приоритет над прямоугольником (если r не равно 0, то, не зависимо от значений rx или ry, рождение будет происходить внутри круга):<br />
<center><br />
[[Файл:flyers_born.png]]<br />
</center><br />
<br />
<br />
<br />
'''Начальная скорость'''<br />
<br />
*'''минимальная''' - Минимальная скорость при рождении летуна в px/сек.<br />
*'''максимальная''' - Максимальная скорость при рождении летуна в px/сек.<br />
*'''от угла''' - Начальный угол сектора для направления скоростей.<br />
*'''до угла''' - Конечный угол сектора для направления скоростей.<br />
*'''угловая''' - Угловая скорость вращения одного летуна в градусах в секунду.<br />
<br />
При рождении каждый флаер имеет определенную скорость, величина (по модулю) которой выбирается случайным образом из диапазона от v1 до v2. Скорость измеряется в пикселях за секунду. Типичные значения, обычно, не превышают 100.<br />
<br />
По умолчанию вектор скорости направлен изотропно (равновероятно во всех направлениях). В разделе "начальная скорость" можно определить сегмент круга, внутри которого будет направлена начальная скорость флаера. Углы отсчитываются от оси x вниз (положительные углы) или вверх (отрицательные углы) и измеряется в градусах. Например, если a1=45, a2=135, то флаеры будут вылетать вниз веером в 90 градусов.<br />
<center><br />
[[Файл:flyers_vel.png]]<br />
</center><br />
<br />
Кроме линейной скорости можно задавать угловую скорость вращения - w, в градусах в секунду. Тогда при движении флаеры будут вращаться. Впрочем, увлекаться этим эффектом не стоит, так как это дополнительная нагрузка на ресурсы.<br />
<br />
<br />
<br />
'''Цикл жизни'''<br />
<br />
*'''на экране''' - Максимально количество летунов, которые видны на экране.<br />
*'''всего''' - Общее число созданных летунов (с учетом того, что они могут умирать и создаваться до числа "на экране").<br />
*'''каскадов''' - Число каскадных рождений (фейерверк).<br />
*'''время''' - Каждый флаер рождается, живет и умирает. Соответственно, можно задать три параметра (tmBorn, tmLife, tmDie) в ms.<br />
** ''' интенсивность ''' - Интенсивность рождения одного флаера в миллисекундах.<br />
** ''' ограничения ''' - Не более штук в миллисекунду (борьба с пульсациями).<br />
** ''' рождения ''' - За период рождения tmBorn прозрачность флаера увеличивается от нуля до заданной в общих настройках. <br />
** ''' время жизни ''' - Длительность жизни одного летуна. tmLife может быть отрицательным. В этом случае флаер живет, пока живет его группа (т.е. у него бесконечное время жизни). Если tmLife положительно, то после истечения времени tmLife флаер умирает в течении времени смерти tmDie. <br />
** ''' время смерти ''' - За это время он меняет свою прозрачность, от установленной в общих параметрах до указанной.<br />
*'''до прозрачности''' - Прозрачность в конце периода умирания. По умолчанию равна нулю.<br />
<br />
Когда флаер окончательно исчезает, вместо него в области рождения может появиться новый флаер. Это происходит, если число летающих к данному моменту флаеров не превышает параметра num (цикл жизни:на экране). Кроме этого, в процессе жизни группы флаеров подсчитывается общее число родившихся флаеров. Если их количество превышает параметр tot (цикл жизни:всего), то рождений больше не происходит. Если tot меньше 0, то подобное ограничение игнорируется.<br />
<br />
Если параметры num и tot допускают рождение новых флаеров, то происходит это с интенсивностью, определяемой временем в миллисекундах на рождение одного флайера nms. Например, если число видимых флаеров равно num=100, а nms=10, то все 100 флаеров покажутся на экране через 1000 ms (одну секунду). Если при этом поставить время жизни tmLife=0, tmDie=1000, то получится файербол. Вообще, чтобы не было пульсаций при порождении флаеров, для интенсивности необходимо пользоваться формулой "общее время на количество":<br />
<pre><br />
nms = (tmBorn+tmLife+tmDie)/ num<br />
</pre><br />
Пульсации могут, тем не менее, происходить, даже при выполнении этой формулы, если параметр nms оказывается существенно меньше времени одного фрейма (вызова таймера). Поэтому надо стремиться к тому, чтобы nms был больше реального периода таймера. Впрочем, при помощи праметра "ограничение" (max) можно задавать максимальное число флаеров, которые могут рождаться в ms (тогда при большом тике таймера больше, чем разрешено не родиться).<br />
<br />
<br />
<br />
'''Действующие силы'''<br />
<br />
На каждый флаер может действовать одна из следующих сил:<br />
*'''горизонтальная''' - Постоянная сила fx вдоль оси х, подобная силе ветра.<br />
*'''вертикальная ''' - Постоянная сила fy вдоль оси у. Если она положительна, то это оказывает эффект силы тяжести (ось y направлена вниз!)<br />
*'''радиальная''' - Постоянная радиальная сила fr. Она направлена к центру группы с координатами (x,y) и не зависит от расстояния до этого центра. Если fr положительна, то это сила отталкивания, если отрицательна - притяжения.<br />
*'''конфайнмента''' - Радиальная сила конфайнмента fc. Сила притяжения стаи к центру. Аналогична fr, но её величина линейно растёт с увеличением расстояния от центра.<br />
*'''к линии''' - Сила притяжения к вертикальной линии, проходящей через координаты центра рождения флаеров (из общих параметров).<br />
*'''случайная''' - Амплитуда стохастического (случайного) воздействия fs. При каждом перемещении к компонентам скорости добавляется случайная велична в диапазоне от -fs до fs. Например, снежинки неплохо моделируются с fy=fs=2<br />
*'''трения''' - Сила трения ff, уменьшающая скорость объектов. Измеряется в процентах уменьшения скорости за секунду: 0 - нет трения, 100 - за секунду остановится.<br />
В результате воздействия сил, и при неконтролируемом подвисании компьютера (таймер получает большой интервал времени), возможно резкое увеличение скорости флаеров. Для контроля этих эффектов служит раздел "ограничения" по скорости (vMax, px/сек) и величине смещения по экрану (dMax, px)<br />
<br />
== Добавляемые параметры ==<br />
<br />
Меню выбора ''Добавляемые параметры'' к объектам активируется по правой кнопки мыши. <br />
<br />
[[Файл:+.png]] '''картинка для рисования флаера''' <br />
*'''картинка для рисования флаера''' - Графический ресурс одного летуна. Перетаскивается мышкой из редактора ресурсов (поле должно быть в состоянии редактирования).<br />
*'''количество картинок этого типа''' - Чем больше это число, тем чаще будет встречаться картинка этого типа.<br />
<br />
Актуален данный параметр, если в эффекте должны участвовать разные летуны. При рождении каждого флаера случайным образом будет выбираться одна из этих картинок.<br />
<br />
== Советы ==<br />
<br />
Для настройки флаеров необходимо контролировать множество параметров. Необходимо четко понимать смысл этих параметров и их возможное влияние на результат. Возможно, помогут следующие советы:<br />
* Сначала надо определиться с базовыми параметрами - область рождения, величина и угол начальных скоростей.<br />
* Затем определить направление и характер сил.<br />
* Не стоит менять за один раз больше 2-х параметров<br />
* На начальном этапе параметры необходимо менять решительно - в 2, в 10 раз и т.п.<br />
* Необходимо экспериментировать с комбинацией цветов и размером флаеров.<br />
* Запоминайте промежуточные, более или менее удачные, наборы параметров, чтобы к ним вернуться, если все "разрегулировалось".<br />
* Если получился прикольный, но не нужный эффект - стоит запомнить его параметры, потом пригодится.<br />
<br />
== Производительность ==<br />
<br />
Флаеры сильно грузят быстродействие машины. Поэтому необходим самоконтроль по необходимости их использования и контроль длительности кадра (с проверкой его на реальных устройствах). Ниже идет ряд советов:<br />
* Если можно нужный эффект реализовать кадрами анимации - часто, лучше анимация, чем флаеры.<br />
* Стремиться реализовать нужный эффект с минимумом флаеров<br />
* Искать баланс соотношения размера картинки и количества флаеров. Большие картинки (даже, если их и не много) - долго рисуются. Большое число маленьких картинок - также плохо, т.к. много ресурсов уходит на обсчет их физики.<br />
* Не увлекаться без нужды вращением частицы - это требует дополнительных вычислений матрицы поворота.<br />
* Сила конфайнмента (зависящая от расстояния) не содержит корня и чуть быстрее радиальной силы.<br />
* Помнить, что хороший эффект может, в силу производительности, совсем не так хорошо выглядеть на мобильном устройстве.<br />
<br />
== Примечания ==<br />
<br />
Флаеры не предполагают, что у них могут быть подобъекты.<br />
Если флаер подобъект машины состояний, то при её движении будет двигаться и центр эмиссии (область рождения флаеров), в результате чего возникает "шлейф"<br />
Флаеры не учитывают прозрачности родительского объекта или сцены, считая её единичной.<br />
<br />
Как уже говорилось, применение к объекту Flyer модификатора '''scale x/scale y''' нежелательно, так как это изменяет положение точки рождения флаера.<br />
Возможное решение этой проблемы будет состоять в следующем: флаер сделать подобъектом другого объекта, например, объекта Image, и применять модификаторы уже к нему.<br />
<br />
== Примеры ==<br />
<br />
===Фонтан===<br />
<br />
[[Файл:flyer_fountain_property.JPG|200px]][[Файл:Fontan2.JPG]]<br />
<br />
===Рыбки ===<br />
<br />
[[Файл:Flyer fish property.JPG|200px]][[Файл:Ribki2.JPG]]<br />
<br />
===Дождь ===<br />
<br />
[[Файл:Flyer_rain1_property.JPG|200px]][[Файл:Dojd2.JPG]]<br />
<br />
===Снег ===<br />
<br />
[[Файл:Sneg1.JPG|200px]][[Файл:Sneg2.JPG]]<br />
<br />
===Фейерверк ===<br />
<br />
[[Файл:Feyerverk1.JPG|200px]][[Файл:Feyerverk2.JPG]]<br />
<br />
===Звезды ===<br />
<br />
[[Файл:Zvezdi1.JPG|200px]][[Файл:Zvezdi2.JPG]]<br />
<br />
===Файербол ===<br />
<br />
[[Файл:Fireball1.JPG|200px]][[Файл:Fireball2.JPG]]<br />
<br />
===Взрыв ===<br />
<br />
[[Файл:Vzriv1.JPG|200px]][[Файл:Vzriv2.JPG]]<br />
<br />
===Дым ===<br />
<br />
[[Файл:Dim1.JPG|200px]][[Файл:Dim2.JPG]]<br />
<br />
===Свеча ===<br />
<br />
[[Файл:Svecha1.JPG|200px]][[Файл:Svecha2.JPG]]<br />
<br />
===Огонь ===<br />
<br />
[[Файл:Flyer fire 1 property.JPG|200px]][[Файл:Flyer_fire.JPG]]<br />
<br />
===Летящие листья ===<br />
<br />
[[Файл:Flyer leaf.JPG|200px]][[Файл:Flyer_leaf_2.JPG]]<br />
<br />
===Стекающие капли ===<br />
<br />
[[Файл:Flyer drop property.JPG|200px]][[Файл:Flyer_drop.JPG]]<br />
<br />
<br />
===Косой дождь ===<br />
<br />
Для изменения угла Flyer был сделан подобъектом объекта типа Image, к которому применялись модификаторы.<br />
<br />
[[Файл:Flyer_rain_2_property.JPG|200px]][[Файл:Flyer_rain_2.JPG]]<br />
<br />
===Парящие руны ===<br />
<br />
[[Файл:Flyer symbol propety.JPG|200px]][[Файл:Flyer_symbol.JPG]]<br />
<br />
===Летающий текст ===<br />
<br />
[[Файл:Flyer_text_propety.JPG|200px]][[Файл:Flyer_text.JPG]]<br />
<br />
Если текст разделить символом переноса строки "'''|'''", то летуны создадутся из указанных слов("слово1|слово2|слово3") или букв ("б|у|к|в|ы").<br />
<br />
===Использование модификатора ''"blending"'' ===<br />
<br />
В данном примере использовались первые три значения этого модификатора: blend, half, add. <br />
<br />
[[Файл:Flyer fire 3 property.JPG|200px]][[Файл:Flyer fire 3.JPG]]<br />
<br />
== Пример ==<br />
<br />
[http://fs5.absolutist.com/files/wikisample/flyer.rar Download]<br />
<br />
<br />
[[Category:Main objects]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=Flyer&diff=9823Flyer2019-07-29T11:32:34Z<p>Apolozova: /* Основные параметры */</p>
<hr />
<div>[[Файл:flyer_fountain_property.JPG|right]]<br />
<br />
'''Flyers '''(флаеры, партиклы)- летающие картинки, при помощи этого [[Object|объекта]] можно реализовывать различные эффекты: взрывы, падающие снежинки, дождь, фонтан, огонь, летающая пыль, дым, пар и т.п.<br />
<br />
== Общие параметры ==<br />
<br />
(см. описание [[Object|Object]])<br />
*'''имя''' - Имя объекта Flyer в дереве проекта. Может быт произвольным.<br />
*'''id-объекта''' - Уникальный номер объекта Flyer, который можно увидеть при наведении курсора на строку "имя".<br />
*'''синхронизация''' - Применяется для синхронизации между лейаутами. Если указан параметр "нет", то объект будет активен только на текущем лейауте. По умолчанию указан параметр "да". <br />
*'''сохранение параметров''' - Настройка этого параметра актуальна, если приложение в дальнейшем будет сворачиваться в системную панель («трей»). Выбирается значение этого параметра из выпадающего списка. Возможны следующие варианты: "нет", "только объект", "объект с подобъектами", "только подобъекты". При выходе из трэя будут восстановлены ранее измененные/установленные (при переходе с одного экрана на другой)параметры объектов или подобъектов в зависимости от выбранного варианта для этого параметра. По умолчанию указан параметр "нет". Следует помнить, что если выбирается для объекта некоторой сцены значения этого параметра отличное от "нет", то должно и предусматриваться соответствующее значение этого параметра и для этой сцены, и для экрана, содержащего эту сцену.<br />
*'''z''' - Параметр порядка рисования объекта. Сначала рисуются объекты с большим z, затем, поверх них - с меньшим.<br />
*'''память''' - Если 1, то при повторном открытии экрана объект не обновляет свои параметры (помнит текущие параметры, оставшиеся от предыдущего посещения экрана). По умолчанию значение этого параметра 0.<br />
*'''тип''' - Тип флаера. Определяет его функциональное назначение и его свойства. Для флаера возможны следующие типы: "картинки", "текст". Выбирается подходящий тип из выпадающего списка. По умолчанию указан тип "картинки".<br />
<br />
== Основные параметры ==<br />
<br />
'''Группа - внешний вид'''<br />
<br />
*'''картинка''' - Служит для рисования флаера в случае выбора типа флаера "картинки" В поле этого параметра находится имя графического ресурса (частицы), перетаскиваемого мышкой из редактора ресурсов (поле должно быть в состоянии редактирования). <br />
*'''текст''' - Служит для рисования флаера в случае выбора типа флаера "текст". <br />
<br />
При выборе типа флаера "картинки" параметр "текст" игнорируется и наоборот. Вместе текст и картинка не существуют.<br />
<br />
<br />
'''Группа - шрифт'''<br />
<br />
Служит для настройки внешнего вида текста в случае выбора типа флаера "текст".<br />
*'''имя''' - Номер шрифта - целое число, начиная с 0 (порядковый номер шрифта). <br />
*'''размер''' - Размер шрифта в пикселях. <br />
*'''цвет''' - Цвет шрифта.<br />
<br />
<br />
'''Группа - модификаторы'''<br />
<br />
*'''alpha''' ''(al)'' - Изменяет прозрачность используемого ресурса: от 0 (прозрачен) до 1 (не прозрачен).<br />
*'''blending''' ''(bl)'' - Alpha смешивание. Взаимодействие каждой новой частицы (source) с раннее отрисованными (dest). Значения данного параметра выбираются из выпадающего списка. Каждый отдельный цвет, который мы видим, создается с помощью комбинации трех цветов: красного (red), зеленого (green) и синего (blue). RGB - является их аббревиатурой . Разные значения модификатора "blending" отличаются способ вычисления значений RGB-каналов и значения прозрачности.<br />
<br />
''' blend ''' - смешивание.<br />
<br />
Rback = (Rsource * Ralpha) + (Rdest * (1 - Ralpha)) <br />
<br />
Gback = (Gsource * Galpha) + (Gdest * (1 - Galpha))<br />
<br />
Bback = (Bsource * Balpha) + (Bdest * (1 - Balpha)) <br />
<br />
Aback = (Asource * Aalpha) + (Adest * (1 - Aalpha))<br />
<br />
<br />
''' half ''' - деление пополам.<br />
<br />
Rback = (Rsource + Rdest) / 2 <br />
<br />
Gback = (Gsource + Gdest) / 2 <br />
<br />
Bback = (Bsource + Bdest) / 2 <br />
<br />
Aback = (Asource + Adest) / 2 <br />
<br />
<br />
''' add ''' - добавление.<br />
<br />
Rback = Rsource + Rdest <br />
<br />
Gback = Gsource + Gdest <br />
<br />
Bback = Bsource + Bdest <br />
<br />
Aback = Asource + Adest <br />
<br />
<br />
''' sub ''' - вычитание.<br />
<br />
Rback = Rsource - Rdest <br />
<br />
Gback = Gsource - Gdest <br />
<br />
Bback = Bsource - Bdest <br />
<br />
Aback = Asource - Adest <br />
<br />
<br />
''' none ''' - ничего не происходит.<br />
*'''angle''' ''(ang)'' - Изменяет угол наклона используемого ресурса. Отсчитывается по часовой стрелке. Против - отсчитываются отрицательные углы. <br />
*'''scaleX/scaleY''' ''(sx/sy)'' – Изменяют масштаб используемого ресурса, но при этом изменяет и положение точки рождения флаера, что делает использование данного модификатора крайне неудобным.<br />
<br />
Модификаторы становятся активными если установлен флаг «использовать модификаторы», в противном случае установленные параметры игнорируются.<br />
<br />
<br />
'''Группа - звуки'''<br />
<br />
*'''звук''' - Звук, который будет запущен при переходе партиклов в состояние beg. Перетаскивается правой кнопкой мышки из редактора ресурсов (поле должно быть в состоянии редактирования).<br />
*'''зациклить''' - Если 1, то звук будет зациклен. По умолчанию значение этого параметра 0.<br />
<br />
== Состояния ==<br />
<br />
*'''beg''' – Состояние в котором флаер начинает свой цикл жизни (включается).<br />
*'''end''' – Состояние которое выключает флаер.<br />
*'''stop_birth''' - Состояние заканчивает рождение. В по сути - "горшочек не вари"<br />
*'''start_birth''' - Начать рождения частиц (по сути отмена состояния - "stop_birth");<br />
*'''pause''' - Заморозить частицы - частицы не меняют свои параметры, но при этом остаются видимыми;<br />
*'''run''' - Вернуть частицам рабочее состояние ( снятие состояния "pause");<br />
<br />
== Дополнительные параметры ==<br />
<br />
<br />
'''Область рождения'''<br />
<br />
*'''только контур''' ''(frame)'' - Если 1, то частицы будут рождаться только по контуру, описанному параметрами. Если 0, то по всей площади.<br />
*'''радиус r''' ''(r)'' - Радиус области вокруг (х,у), где рождаются летуны.<br />
*'''горизонтальная rx''' ''(rx)'' - Горизонтальная область рождения. Летуны будут рождаться внутри прямоугольника с шириной 2*rx.<br />
*'''вертикальная ry''' ''(ry)'' - Вертикальная область рождения. Летуны будут рождаться внутри прямоугольника с высотой 2*ry.<br />
<br />
Если все параметры области рождения равны нулю: r=rx=ry=0, то летуны будут рождаться из одной точки.<br />
Центр области рождения задается стандартными для всех объектов координатами x,y из раздела "положение". Круг имеет приоритет над прямоугольником (если r не равно 0, то, не зависимо от значений rx или ry, рождение будет происходить внутри круга):<br />
<center><br />
[[Файл:flyers_born.png]]<br />
</center><br />
<br />
<br />
<br />
'''Начальная скорость'''<br />
<br />
*'''минимальная''' - Минимальная скорость при рождении летуна в px/сек.<br />
*'''максимальная''' - Максимальная скорость при рождении летуна в px/сек.<br />
*'''от угла''' - Начальный угол сектора для направления скоростей.<br />
*'''до угла''' - Конечный угол сектора для направления скоростей.<br />
*'''угловая''' - Угловая скорость вращения одного летуна в градусах в секунду.<br />
<br />
При рождении каждый флаер имеет определенную скорость, величина (по модулю) которой выбирается случайным образом из диапазона от v1 до v2. Скорость измеряется в пикселях за секунду. Типичные значения, обычно, не превышают 100.<br />
<br />
По умолчанию вектор скорости направлен изотропно (равновероятно во всех направлениях). В разделе "начальная скорость" можно определить сегмент круга, внутри которого будет направлена начальная скорость флаера. Углы отсчитываются от оси x вниз (положительные углы) или вверх (отрицательные углы) и измеряется в градусах. Например, если a1=45, a2=135, то флаеры будут вылетать вниз веером в 90 градусов.<br />
<center><br />
[[Файл:flyers_vel.png]]<br />
</center><br />
<br />
Кроме линейной скорости можно задавать угловую скорость вращения - w, в градусах в секунду. Тогда при движении флаеры будут вращаться. Впрочем, увлекаться этим эффектом не стоит, так как это дополнительная нагрузка на ресурсы.<br />
<br />
<br />
<br />
'''Цикл жизни'''<br />
<br />
*'''на экране''' - Максимально количество летунов, которые видны на экране.<br />
*'''всего''' - Общее число созданных летунов (с учетом того, что они могут умирать и создаваться до числа "на экране").<br />
*'''каскадов''' - Число каскадных рождений (фейерверк).<br />
*'''время''' - Каждый флаер рождается, живет и умирает. Соответственно, можно задать три параметра (tmBorn, tmLife, tmDie) в ms.<br />
** ''' интенсивность ''' - Интенсивность рождения одного флаера в миллисекундах.<br />
** ''' ограничения ''' - Не более штук в миллисекунду (борьба с пульсациями).<br />
** ''' рождения ''' - За период рождения tmBorn прозрачность флаера увеличивается от нуля до заданной в общих настройках. <br />
** ''' время жизни ''' - Длительность жизни одного летуна. tmLife может быть отрицательным. В этом случае флаер живет, пока живет его группа (т.е. у него бесконечное время жизни). Если tmLife положительно, то после истечения времени tmLife флаер умирает в течении времени смерти tmDie. <br />
** ''' время смерти ''' - За это время он меняет свою прозрачность, от установленной в общих параметрах до указанной.<br />
*'''до прозрачности''' - Прозрачность в конце периода умирания. По умолчанию равна нулю.<br />
<br />
Когда флаер окончательно исчезает, вместо него в области рождения может появиться новый флаер. Это происходит, если число летающих к данному моменту флаеров не превышает параметра num (цикл жизни:на экране). Кроме этого, в процессе жизни группы флаеров подсчитывается общее число родившихся флаеров. Если их количество превышает параметр tot (цикл жизни:всего), то рождений больше не происходит. Если tot меньше 0, то подобное ограничение игнорируется.<br />
<br />
Если параметры num и tot допускают рождение новых флаеров, то происходит это с интенсивностью, определяемой временем в миллисекундах на рождение одного флайера nms. Например, если число видимых флаеров равно num=100, а nms=10, то все 100 флаеров покажутся на экране через 1000 ms (одну секунду). Если при этом поставить время жизни tmLife=0, tmDie=1000, то получится файербол. Вообще, чтобы не было пульсаций при порождении флаеров, для интенсивности необходимо пользоваться формулой "общее время на количество":<br />
<pre><br />
nms = (tmBorn+tmLife+tmDie)/ num<br />
</pre><br />
Пульсации могут, тем не менее, происходить, даже при выполнении этой формулы, если параметр nms оказывается существенно меньше времени одного фрейма (вызова таймера). Поэтому надо стремиться к тому, чтобы nms был больше реального периода таймера. Впрочем, при помощи праметра "ограничение" (max) можно задавать максимальное число флаеров, которые могут рождаться в ms (тогда при большом тике таймера больше, чем разрешено не родиться).<br />
<br />
<br />
<br />
'''Действующие силы'''<br />
<br />
На каждый флаер может действовать одна из следующих сил:<br />
*'''горизонтальная''' - Постоянная сила fx вдоль оси х, подобная силе ветра.<br />
*'''вертикальная ''' - Постоянная сила fy вдоль оси у. Если она положительна, то это оказывает эффект силы тяжести (ось y направлена вниз!)<br />
*'''радиальная''' - Постоянная радиальная сила fr. Она направлена к центру группы с координатами (x,y) и не зависит от расстояния до этого центра. Если fr положительна, то это сила отталкивания, если отрицательна - притяжения.<br />
*'''конфайнмента''' - Радиальная сила конфайнмента fc. Сила притяжения стаи к центру. Аналогична fr, но её величина линейно растёт с увеличением расстояния от центра.<br />
*'''к линии''' - Сила притяжения к вертикальной линии, проходящей через координаты центра рождения флаеров (из общих параметров).<br />
*'''случайная''' - Амплитуда стохастического (случайного) воздействия fs. При каждом перемещении к компонентам скорости добавляется случайная велична в диапазоне от -fs до fs. Например, снежинки неплохо моделируются с fy=fs=2<br />
*'''трения''' - Сила трения ff, уменьшающая скорость объектов. Измеряется в процентах уменьшения скорости за секунду: 0 - нет трения, 100 - за секунду остановится.<br />
В результате воздействия сил, и при неконтролируемом подвисании компьютера (таймер получает большой интервал времени), возможно резкое увеличение скорости флаеров. Для контроля этих эффектов служит раздел "ограничения" по скорости (vMax, px/сек) и величине смещения по экрану (dMax, px)<br />
<br />
== Добавляемые параметры ==<br />
<br />
Меню выбора ''Добавляемые параметры'' к объектам активируется по правой кнопки мыши. <br />
<br />
[[Файл:+.png]] '''картинка для рисования флаера''' <br />
*'''картинка для рисования флаера''' - Графический ресурс одного летуна. Перетаскивается мышкой из редактора ресурсов (поле должно быть в состоянии редактирования).<br />
*'''количество картинок этого типа''' - Чем больше это число, тем чаще будет встречаться картинка этого типа.<br />
<br />
Актуален данный параметр, если в эффекте должны участвовать разные летуны. При рождении каждого флаера случайным образом будет выбираться одна из этих картинок.<br />
<br />
== Советы ==<br />
<br />
Для настройки флаеров необходимо контролировать множество параметров. Необходимо четко понимать смысл этих параметров и их возможное влияние на результат. Возможно, помогут следующие советы:<br />
* Сначала надо определиться с базовыми параметрами - область рождения, величина и угол начальных скоростей.<br />
* Затем определить направление и характер сил.<br />
* Не стоит менять за один раз больше 2-х параметров<br />
* На начальном этапе параметры необходимо менять решительно - в 2, в 10 раз и т.п.<br />
* Необходимо экспериментировать с комбинацией цветов и размером флаеров.<br />
* Запоминайте промежуточные, более или менее удачные, наборы параметров, чтобы к ним вернуться, если все "разрегулировалось".<br />
* Если получился прикольный, но не нужный эффект - стоит запомнить его параметры, потом пригодится.<br />
<br />
== Производительность ==<br />
<br />
Флаеры сильно грузят быстродействие машины. Поэтому необходим самоконтроль по необходимости их использования и контроль длительности кадра (с проверкой его на реальных устройствах). Ниже идет ряд советов:<br />
* Если можно нужный эффект реализовать кадрами анимации - часто, лучше анимация, чем флаеры.<br />
* Стремиться реализовать нужный эффект с минимумом флаеров<br />
* Искать баланс соотношения размера картинки и количества флаеров. Большие картинки (даже, если их и не много) - долго рисуются. Большое число маленьких картинок - также плохо, т.к. много ресурсов уходит на обсчет их физики.<br />
* Не увлекаться без нужды вращением частицы - это требует дополнительных вычислений матрицы поворота.<br />
* Сила конфайнмента (зависящая от расстояния) не содержит корня и чуть быстрее радиальной силы.<br />
* Помнить, что хороший эффект может, в силу производительности, совсем не так хорошо выглядеть на мобильном устройстве.<br />
<br />
== Примечания ==<br />
<br />
Флаеры не предполагают, что у них могут быть подобъекты.<br />
Если флаер подобъект машины состояний, то при её движении будет двигаться и центр эмиссии (область рождения флаеров), в результате чего возникает "шлейф"<br />
Флаеры не учитывают прозрачности родительского объекта или сцены, считая её единичной.<br />
<br />
Как уже говорилось, применение к объекту Flyer модификатора '''scale x/scale y''' нежелательно, так как это изменяет положение точки рождения флаера.<br />
Возможное решение этой проблемы будет состоять в следующем: флаер сделать подобъектом другого объекта, например, объекта Image, и применять модификаторы уже к нему.<br />
<br />
== Примеры ==<br />
<br />
===Фонтан===<br />
<br />
[[Файл:flyer_fountain_property.JPG|200px]][[Файл:Fontan2.JPG]]<br />
<br />
===Рыбки ===<br />
<br />
[[Файл:Flyer fish property.JPG|200px]][[Файл:Ribki2.JPG]]<br />
<br />
===Дождь ===<br />
<br />
[[Файл:Flyer_rain1_property.JPG|200px]][[Файл:Dojd2.JPG]]<br />
<br />
===Снег ===<br />
<br />
[[Файл:Sneg1.JPG|200px]][[Файл:Sneg2.JPG]]<br />
<br />
===Фейерверк ===<br />
<br />
[[Файл:Feyerverk1.JPG|200px]][[Файл:Feyerverk2.JPG]]<br />
<br />
===Звезды ===<br />
<br />
[[Файл:Zvezdi1.JPG|200px]][[Файл:Zvezdi2.JPG]]<br />
<br />
===Файербол ===<br />
<br />
[[Файл:Fireball1.JPG|200px]][[Файл:Fireball2.JPG]]<br />
<br />
===Взрыв ===<br />
<br />
[[Файл:Vzriv1.JPG|200px]][[Файл:Vzriv2.JPG]]<br />
<br />
===Дым ===<br />
<br />
[[Файл:Dim1.JPG|200px]][[Файл:Dim2.JPG]]<br />
<br />
===Свеча ===<br />
<br />
[[Файл:Svecha1.JPG|200px]][[Файл:Svecha2.JPG]]<br />
<br />
===Огонь ===<br />
<br />
[[Файл:Flyer fire 1 property.JPG|200px]][[Файл:Flyer_fire.JPG]]<br />
<br />
===Летящие листья ===<br />
<br />
[[Файл:Flyer leaf.JPG|200px]][[Файл:Flyer_leaf_2.JPG]]<br />
<br />
===Стекающие капли ===<br />
<br />
[[Файл:Flyer drop property.JPG|200px]][[Файл:Flyer_drop.JPG]]<br />
<br />
<br />
===Косой дождь ===<br />
<br />
Для изменения угла Flyer был сделан подобъектом объекта типа Image, к которому применялись модификаторы.<br />
<br />
[[Файл:Flyer_rain_2_property.JPG|200px]][[Файл:Flyer_rain_2.JPG]]<br />
<br />
===Парящие руны ===<br />
<br />
[[Файл:Flyer symbol propety.JPG|200px]][[Файл:Flyer_symbol.JPG]]<br />
<br />
===Летающий текст ===<br />
<br />
[[Файл:Flyer_text_propety.JPG|200px]][[Файл:Flyer_text.JPG]]<br />
<br />
Если текст разделить символом переноса строки "'''|'''", то летуны создадутся из указанных слов("слово1|слово2|слово3") или букв ("б|у|к|в|ы").<br />
<br />
===Использование модификатора ''"blending"'' ===<br />
<br />
В данном примере использовались первые три значения этого модификатора: blend, half, add. <br />
<br />
[[Файл:Flyer fire 3 property.JPG|200px]][[Файл:Flyer fire 3.JPG]]<br />
<br />
== Пример ==<br />
<br />
[http://fs5.absolutist.com/files/wikisample/flyer.rar Download]<br />
<br />
<br />
[[Category:Main objects]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%AD%D0%BA%D1%81%D0%BF%D0%BE%D1%80%D1%82,_%D0%B8%D0%BC%D0%BF%D0%BE%D1%80%D1%82_%D0%B8_%D1%80%D0%B5%D0%BB%D0%B8%D0%B7_%D0%BF%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D0%B0&diff=9822Экспорт, импорт и релиз проекта2019-07-29T11:07:15Z<p>Apolozova: </p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Работа с эффектами|Урок 9]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Создание простой адвентюры|Урок 11]]<br />
|}<br />
----<br />
{{TOC right}}<br />
----<br />
'''Цель:''' <br />
создать исполняемый файл для запуска проекта на для поддержки всех устройств Apple.<br />
<br />
'''Задачи:''' <br />
* проверить параметры созданного проекта;<br />
* Настроить viever.xml; <br />
* подготовить проект для финального релиза;<br />
* определить параметры экспорта проекта;<br />
* подготовить проект для создания исполняемого файла;<br />
* запустить проект на устройстве. <br />
<br />
== Лейауты ==<br />
<br />
Напомним ([[Введение в AppSalute Сreator|урок 1]]), что лейаут (layout) -<br />
это экран конкретного устройства (телефон, планшетник, десктоп),<br />
имеющего определенное разрешение в пикселях: <br />
<br />
[[Файл:lesson_1_layouts.png|500px]]<br />
<br />
Самое неприятное при разработке игрового приложения это то, что <br />
соотношение ширины и высоты экранов различных устройств отличаются друг от друга.<br />
Поэтому недостаточно растянуть или сжать изображение, чтобы оно "вписалось" в экран.<br />
Необходимо верхние или боковые части изображения обрезать или наоборот расширять<br />
путем добавления полосок, органично вписывающихся в интерфейс (внешний вид) игры.<br />
<br />
Некоторые устройства физически являются на столько "мелкими", что, например, кнопки<br />
необходимо для него делать более крупными, чем для устройства с большим экраном.<br />
Кроме этого, иногда требуется поддерживать сразу две ориентации экрана (вертикальную и горизонтальную)<br />
и т.д., и т.п.<br />
<br />
=== Один Layout на разных экранах ===<br />
[[Файл:L01.png|400px|right]]<br />
<br />
[[Файл:L02.png|400px|right]]<br />
<br />
[[Файл:L03.png|400px|right]]<br />
<br />
===Параметры===<br />
<br />
*sx - ручное масштабирование по х<br />
*sy - ручное масштабирование по y<br />
*x - сдвиг изображения по x<br />
*y - сдвиг изображения по y<br />
*autoPosX - автоматическое позиционирование по х<br />
*autoPosY - автоматическое позиционирование по y<br />
*autoScX - автоматическое масштабирование по x<br />
*autoScY - автоматическое масштабирование по y<br />
<br />
===Расшифровка viever.xml===<br />
<br />
<dev /> - устройство(разрешение экрана полученое из системы) на котором будут применяться параметры<br />
<br />
w, h - ширина и высота разрешения экрана устройства для которого будут применены параметры<br />
<br />
далее идут параметры масштабирования, сдвига и позиционирования экрана<br />
<br />
nm - название лейаута, отображается в отладочном режиме на экране настроек<br />
<br />
===Применение===<br />
Пусть экран размера 960х640 и необходимо его настроить следующим образом:<br />
для ipad-ов предусмотрены сверху и снизу поля, которые "отрежутся", для iphone5 предусмотрена справа и слева графика. Следовательно для ipad надо растянуть изображение по ширине, для iphone 5 по высоте, для iphone 4 - без разницы - родное разрешение.<br />
<br />
Для этого необходимо составить настройки для всех разрешений экранов.<br />
<br />
'''iPad'''<br />
<br />
# укажем разрешение экрана w="1024" h="768" для ipad 1, 2, mini и w="2048" h="1536" для ipad 3<br />
# автоматически потянем по ширине autoScX="1" - изображение пропорционально отмасштабируется таким образом, чтобы ширина экрана соответствовала ширине экрана устройства.<br />
# автоматически отпозиционируем по y - т.к. по ширине тянем autoPosY="1"<br />
# можно указать что по y пропорционально не надо тянуть autoScY="0", хотя это не обязательно<br />
# укажем название nm="ipad 1 2" и nm="ipad 3" - удобно для проверки<br />
<br />
<dev w="1024" h="768" autoPosY="1" autoScX="1" autoScY="0" nm="ipad 1 2" /><br />
<br />
<dev w="2048" h="1536" autoPosY="1" autoScX="1" autoScY="0" nm="ipad 3" /><br />
<br />
<br />
'''iPhone 4/4s'''<br />
<br />
# укажем разрешение экрана w="960" h="640" <br />
# автоматически потянем по ширине autoScX="1" - изображение пропорционально отмасштабируется таким образом, чтобы ширина экрана соответствовала ширине экрана устройства. Хотя можно тянуть и по y.<br />
# автоматически отпозиционируем по y - т.к. по ширине тянем autoPosY="1"<br />
# можно указать что по y пропорционально не надо тянуть autoScY="0", хотя это не обязательно<br />
# укажем название nm="iphone 4" <br />
<br />
<dev w="960" h="640" autoPosY="1" autoScX="1" autoScY="0" nm="iphone 4" /><br />
<br />
<br />
'''iPhone 5'''<br />
<br />
# укажем разрешение экрана w="1136" h="640" <br />
# автоматически потянем по ширине autoScY="1" - изображение пропорционально отмасштабируется таким образом, чтобы высота экрана соответствовала высоте экрана устройства. <br />
# автоматически отпозиционируем по x - т.к. по ширине тянем autoPosX="1"<br />
# можно указать что по x пропорционально не надо тянуть autoScX="0", хотя это не обязательно<br />
# укажем название nm="iphone 5" <br />
<br />
<dev w="960" h="1136" autoPosX="1" autoScY="1" autoScX="0" nm="iphone 5" /><br />
<br />
В итоге получим такую конфигурацию файла:<br />
<br />
<pre><br />
<?xml version='1.0' encoding='UTF-8' standalone='no'?><br />
<viewer><br />
<banners platform_id="2" instal_dir="assets/games/iphone/"/><br />
<globaltop /><br />
<flurry game_id=""/><br />
<dev w="1024" h="768" autoPosY="1" autoScX="1" autoScY="0" nm="ipad 1 2" /><br />
<dev w="2048" h="1536" autoPosY="1" autoScX="1" autoScY="0" nm="ipad 3" /><br />
<dev w="960" h="640" autoPosY="1" autoScX="1" autoScY="0" nm="iphone 4" /><br />
<dev w="960" h="1136" autoPosX="1" autoScY="1" autoScX="0" nm="iphone 5" /><br />
<default prj="project.seproj" cut="0" video_memory="64715200" color_aabbggrr="ff000000" scr="0" lay="0"/> <br />
</viewer> <br />
</pre><br />
<br />
Если надо отключить полосу загрузки, которая показывается при переходе между экранами делается это добавлением параметра progressbar="0".<br />
<br />
<default prj="project.seproj" cut="0" video_memory="64715200" color_aabbggrr="ff000000" scr="0" lay="0" ''progressbar="0"'' /><br />
<br />
===Правила применения===<br />
<br />
# следует избегать одновременного масштабирования по x и по y<br />
# если масштабируется изображение по x, то позиционирование должно быть по y<br />
# использовать или ручной сдвиг, или позиционирование. Лучше позиционирование.<br />
<br />
[[Файл:Plat.png|right]]<br />
<br />
== Подготовка проекта ==<br />
Мы подошли к самому интересному :-), - это запуск проекта на мобильном устройстве и не только.<br />
<br />
При экспорте проекта осуществляется поддержка основных платформ:<br />
<br />
*iPhone<br />
*Android<br />
*Windows<br />
*MacOS (Для сборки пакета необходима инсталляция на OS Mac)<br />
*Play Book (Blackberry)<br />
*Flash [[Файл:FlashPlayer.png|30px]]<br />
<br />
=== Создание нового проекта ===<br />
<br />
Перед экспортом проекта необходимо проверить настройки проекта.<br />
*Конфигурацию в файле app.icf<br />
*Настройки шрифтов<br />
*Наличие иконок<br />
<br />
Общая структура файла конфигурации приложения [[App.icf|app.icf]] описана здесь<br />
<br />
Основные параметры которые необходимо проверить <br />
*'''MemSize'''=32000000 - значение памяти которое выделяем для приложения<br />
*[Fonts]<br />
<br />
font_1="1_arial_16" - шрифт и его номер который используется в проекте<br />
<br />
=== Экспорт ===<br />
[[Файл:Exp11.png|right]]<br />
Процедура экспорта с точки зрения пользователя одна из самых простых и требует минимальных настроек, однако скрытые операции достаточно сложны и ресурсоемки. Экспорт проекта необходимо проводить каждый раз перед созданием исполняемых файлов.<br />
<br />
Основные этапы <br />
*Выполняется сжатие графики при необходимости <br />
*Очистка базы ресурсов от неиспользуемой графики<br />
*Запаковка графики в текстуры и контейнер<br />
<br />
Итак, перед экспортом проекта необходимо сохранить все изменения сделанные в проекте ранее.<br />
<br />
Настройки экспорта состоят из:<br />
<br />
[[Файл:Exp12.png|right]]<br />
<br />
<br />
'''Параметров сжатия графики''' - Можно указывать значение от 1 до 0 для осей '''x'''(width) '''y'''(height). Указанный параметр '''x'''= 0,75 будет соответствовать 75% по ширине от исходного размера лейаута. Сжатие также возможно и непропорциональное т е с указанием разных значений по осям (не рекомендуется использовать). <br />
Пример использования: вы создали проект для iPad retina с размерами лейаута (2024x1536), теперь вы хотите сформировать исполняемый файл для Android планшета с разрешением экрана 1024х768. Для этого необходимо указать в параметрах '''x''' и '''y''' значение равное 0,5 (50%). В результате экспорта получим графику с разрешением 1024х768 и все параметры проекта будут пересчитаны под данное разрешение.<br />
<br />
'''Результат:''' значительная экономия в размерах .apk файла и огромная экономия оперативной памяти на устройстве.<br />
<br />
'''Тип экспорта''' <br />
*'''One project file''' - формируется один XML файл описывающий проект. Рекомендуется использовать второй тип при значительных размерах проекта.<br />
<br />
*'''Split project on screens, load partly''' - проект будет разбит на отдельные файлы описывающие экраны, загружаться файлы будут в порядке использования (вызова) в проекте. В результате получаем увеличение начальной загрузки проекта и использование меньшего объема оперативной памяти.<br />
<br />
'''Параметры запаковки графики'''<br />
*'''Packege Type''' - упаковка ресурсов в фаил с типом DAT. Обеспечиваем защиту ресурсов проекта от несанкционированного доступа. Увеличиваем производительность при операциях чтения файлов ресурсов с твердотельного носителя.<br />
*'''Texture Type''' - упаковка графических файлов в текстуры. Необходимо для уменьшения используемого объема оперативной памяти.<br />
<br />
'''Export to folder''' - Путь для экспорта. Для создания папки с экспортом необходимо указать любой путь (папку) на диске. Будет создана папка [[Файл:Proj_folder.png]]<br />
<br />
Структура папки:<br />
<br />
[[Файл:TreeFolder.png]]<br />
<br />
'''Select platform''' - необходимо выбрать платформу для которой будем собирать проект. <br />
<br />
'''Примечание:''' ''Для сборки под различный платформы необходимо установить Marmalade SDK'' [[Установка и настройка|см. инструкцию]] <br />
при этом не нужно указывать путь для экспорта (оставить поле пустым). В результате запустится скрипт сборки исполняемого пакета, <br />
это будет видно по черным экранам с ходом выполнения процесса сборки.<br />
<br />
'''Итак:''' Сохраняем открытый проект с выполненными уроками <tt>Project</tt> &rarr; <tt>Export</tt> настраиваем параметры как показано на картинке<br />
<br />
[[Файл:Export_window.png]]<br />
<br />
Нажимаем кнопку <tt>Ok</tt> и ждем несколько минут. <br />
Процесс экспорта будет отображаться в окне<br />
<br />
[[Файл:Export_progres.png]]<br />
<br />
В результате экспорта у вас должно открыться приложение iTunes с добавленным проектом Absolutist с иконкой [[Файл:114.png|50px]]<br />
<br />
'''Поздравляю Вы это сделали!!'''<br />
<br />
Если вы не получили ожидаемого результата необходимо проверить следующее:<br />
# Для сборки пакетов под iPhone платформу вы должны иметь сертификат разработчика<br />
# Проверить ход выполнения настройки по [[Установка и настройка|см. инструкцию]]<br />
# Проверить и\или установить iTunes<br />
<br />
Если вы обладатель мобильного устройства на системе Android необходимо указать ''Android'' в разделе '''Select platform''' и вы получите фаил absolutist.apk<br />
<br />
'''Поздравляю Вы это сделали!!'''<br />
<br />
== Упражнения ==<br />
<br />
* Настройте параметры viever.xml для корректной работы на вашем мобильном устройстве (если конечно оно у вас есть)<br />
* Настройте параметры viever.xml для системы Windows под рабочий монитор<br />
* Определите какое разрешение для ваших игр наиболее подходящее<br />
* Создайте проект для вашего мобильного устройства <br />
<br />
<br />
----<br />
{| width="100%" <br />
| width="40%"|[[Работа с эффектами|Урок 9]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Создание простой адвентюры|Урок 11]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%AD%D0%BA%D1%81%D0%BF%D0%BE%D1%80%D1%82,_%D0%B8%D0%BC%D0%BF%D0%BE%D1%80%D1%82_%D0%B8_%D1%80%D0%B5%D0%BB%D0%B8%D0%B7_%D0%BF%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D0%B0&diff=9821Экспорт, импорт и релиз проекта2019-07-29T11:05:07Z<p>Apolozova: </p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Работа с эффектами|Урок 9]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Создание простой адвентюры|Урок 11]]<br />
|}<br />
----<br />
{{TOC right}}<br />
----<br />
'''Цель:''' <br />
создать исполняемый файл для запуска проекта на для поддержки всех устройств Apple.<br />
<br />
'''Задачи:''' <br />
* проверить параметры созданного проекта;<br />
* Настроить viever.xml; <br />
* подготовить проект для финального релиза;<br />
* определить параметры экспорта проекта;<br />
* подготовить проект для создания исполняемого файла;<br />
* запустить проект на устройстве. <br />
<br />
== Лейауты ==<br />
<br />
Напомним ([[Введение в AppSalute Сreator|урок 1]]), что лейаут (layout) -<br />
это экран конкретного устройства (телефон, планшетник, десктоп),<br />
имеющего определенное разрешение в пикселях: <br />
<br />
[[Файл:lesson_1_layouts.png|500px]]<br />
<br />
Самое неприятное при разработке игрового приложения это то, что <br />
соотношение ширины и высоты экранов различных устройств отличаются друг от друга.<br />
Поэтому недостаточно растянуть или сжать изображение, чтобы оно "вписалось" в экран.<br />
Необходимо верхние или боковые части изображения обрезать или наоборот расширять<br />
путем добавления полосок, органично вписывающихся в интерфейс (внешний вид) игры.<br />
<br />
Некоторые устройства физически являются на столько "мелкими", что, например, кнопки<br />
необходимо для него делать более крупными, чем для устройства с большим экраном.<br />
Кроме этого, иногда требуется поддерживать сразу две ориентации экрана (вертикальную и горизонтальную)<br />
и т.д., и т.п.<br />
<br />
=== Один Layout на разных экранах ===<br />
[[Файл:L01.png|400px|right]]<br />
<br />
[[Файл:L02.png|400px|right]]<br />
<br />
[[Файл:L03.png|400px|right]]<br />
<br />
===Параметры===<br />
<br />
*sx - ручное масштабирование по х<br />
*sy - ручное масштабирование по y<br />
*x - сдвиг изображения по x<br />
*y - сдвиг изображения по y<br />
*autoPosX - автоматическое позиционирование по х<br />
*autoPosY - автоматическое позиционирование по y<br />
*autoScX - автоматическое масштабирование по x<br />
*autoScY - автоматическое масштабирование по y<br />
<br />
===Расшифровка viever.xml===<br />
<br />
<dev /> - устройство(разрешение экрана полученое из системы) на котором будут применяться параметры<br />
<br />
w, h - ширина и высота разрешения экрана устройства для которого будут применены параметры<br />
<br />
далее идут параметры масштабирования, сдвига и позиционирования экрана<br />
<br />
nm - название лейаута, отображается на экрана в отладочном режиме на экране настроек<br />
<br />
===Применение===<br />
Пусть экран размера 960х640 и необходимо его настроить следующим образом:<br />
для ipad-ов предусмотрены сверху и снизу поля, которые "отрежутся", для iphone5 предусмотрена справа и слева графика. Следовательно для ipad надо растянуть изображение по ширине, для iphone 5 по высоте, для iphone 4 - без разницы - родное разрешение.<br />
<br />
Для этого необходимо составить настройки для всех разрешений экранов.<br />
<br />
'''iPad'''<br />
<br />
# укажем разрешение экрана w="1024" h="768" для ipad 1, 2, mini и w="2048" h="1536" для ipad 3<br />
# автоматически потянем по ширине autoScX="1" - изображение пропорционально отмасштабируется таким образом, чтобы ширина экрана соответствовала ширине экрана устройства.<br />
# автоматически отпозиционируем по y - т.к. по ширине тянем autoPosY="1"<br />
# можно указать что по y пропорционально не надо тянуть autoScY="0", хотя это не обязательно<br />
# укажем название nm="ipad 1 2" и nm="ipad 3" - удобно для проверки<br />
<br />
<dev w="1024" h="768" autoPosY="1" autoScX="1" autoScY="0" nm="ipad 1 2" /><br />
<br />
<dev w="2048" h="1536" autoPosY="1" autoScX="1" autoScY="0" nm="ipad 3" /><br />
<br />
<br />
'''iPhone 4/4s'''<br />
<br />
# укажем разрешение экрана w="960" h="640" <br />
# автоматически потянем по ширине autoScX="1" - изображение пропорционально отмасштабируется таким образом, чтобы ширина экрана соответствовала ширине экрана устройства. Хотя можно тянуть и по y.<br />
# автоматически отпозиционируем по y - т.к. по ширине тянем autoPosY="1"<br />
# можно указать что по y пропорционально не надо тянуть autoScY="0", хотя это не обязательно<br />
# укажем название nm="iphone 4" <br />
<br />
<dev w="960" h="640" autoPosY="1" autoScX="1" autoScY="0" nm="iphone 4" /><br />
<br />
<br />
'''iPhone 5'''<br />
<br />
# укажем разрешение экрана w="1136" h="640" <br />
# автоматически потянем по ширине autoScY="1" - изображение пропорционально отмасштабируется таким образом, чтобы высота экрана соответствовала высоте экрана устройства. <br />
# автоматически отпозиционируем по x - т.к. по ширине тянем autoPosX="1"<br />
# можно указать что по x пропорционально не надо тянуть autoScX="0", хотя это не обязательно<br />
# укажем название nm="iphone 5" <br />
<br />
<dev w="960" h="1136" autoPosX="1" autoScY="1" autoScX="0" nm="iphone 5" /><br />
<br />
В итоге получим такую конфигурацию файла:<br />
<br />
<pre><br />
<?xml version='1.0' encoding='UTF-8' standalone='no'?><br />
<viewer><br />
<banners platform_id="2" instal_dir="assets/games/iphone/"/><br />
<globaltop /><br />
<flurry game_id=""/><br />
<dev w="1024" h="768" autoPosY="1" autoScX="1" autoScY="0" nm="ipad 1 2" /><br />
<dev w="2048" h="1536" autoPosY="1" autoScX="1" autoScY="0" nm="ipad 3" /><br />
<dev w="960" h="640" autoPosY="1" autoScX="1" autoScY="0" nm="iphone 4" /><br />
<dev w="960" h="1136" autoPosX="1" autoScY="1" autoScX="0" nm="iphone 5" /><br />
<default prj="project.seproj" cut="0" video_memory="64715200" color_aabbggrr="ff000000" scr="0" lay="0"/> <br />
</viewer> <br />
</pre><br />
<br />
Если надо отключить полосу загрузки, которая показывается при переходе между экранами делается это добавлением параметра progressbar="0".<br />
<br />
<default prj="project.seproj" cut="0" video_memory="64715200" color_aabbggrr="ff000000" scr="0" lay="0" ''progressbar="0"'' /><br />
<br />
===Правила применения===<br />
<br />
# следует избегать одновременного масштабирования по x и по y<br />
# если масштабируется изображение по x, то позиционирование должно быть по y<br />
# использовать или ручной сдвиг, или позиционирование. Лучше позиционирование.<br />
<br />
[[Файл:Plat.png|right]]<br />
<br />
== Подготовка проекта ==<br />
Мы подошли к самому интересному :-), - это запуск проекта на мобильном устройстве и не только.<br />
<br />
При экспорте проекта осуществляется поддержка основных платформ:<br />
<br />
*iPhone<br />
*Android<br />
*Windows<br />
*MacOS (Для сборки пакета необходима инсталляция на OS Mac)<br />
*Play Book (Blackberry)<br />
*Flash [[Файл:FlashPlayer.png|30px]]<br />
<br />
=== Создание нового проекта ===<br />
<br />
Перед экспортом проекта необходимо проверить настройки проекта.<br />
*Конфигурацию в файле app.icf<br />
*Настройки шрифтов<br />
*Наличие иконок<br />
<br />
Общая структура файла конфигурации приложения [[App.icf|app.icf]] описана здесь<br />
<br />
Основные параметры которые необходимо проверить <br />
*'''MemSize'''=32000000 - значение памяти которое выделяем для приложения<br />
*[Fonts]<br />
<br />
font_1="1_arial_16" - шрифт и его номер который используется в проекте<br />
<br />
=== Экспорт ===<br />
[[Файл:Exp11.png|right]]<br />
Процедура экспорта с точки зрения пользователя одна из самых простых и требует минимальных настроек, однако скрытые операции достаточно сложны и ресурсоемки. Экспорт проекта необходимо проводить каждый раз перед созданием исполняемых файлов.<br />
<br />
Основные этапы <br />
*Выполняется сжатие графики при необходимости <br />
*Очистка базы ресурсов от неиспользуемой графики<br />
*Запаковка графики в текстуры и контейнер<br />
<br />
Итак, перед экспортом проекта необходимо сохранить все изменения сделанные в проекте ранее.<br />
<br />
Настройки экспорта состоят из:<br />
<br />
[[Файл:Exp12.png|right]]<br />
<br />
<br />
'''Параметров сжатия графики''' - Можно указывать значение от 1 до 0 для осей '''x'''(width) '''y'''(height). Указанный параметр '''x'''= 0,75 будет соответствовать 75% по ширине от исходного размера лейаута. Сжатие также возможно и непропорциональное т е с указанием разных значений по осям (не рекомендуется использовать). <br />
Пример использования: вы создали проект для iPad retina с размерами лейаута (2024x1536), теперь вы хотите сформировать исполняемый файл для Android планшета с разрешением экрана 1024х768. Для этого необходимо указать в параметрах '''x''' и '''y''' значение равное 0,5 (50%). В результате экспорта получим графику с разрешением 1024х768 и все параметры проекта будут пересчитаны под данное разрешение.<br />
<br />
'''Результат:''' значительная экономия в размерах .apk файла и огромная экономия оперативной памяти на устройстве.<br />
<br />
'''Тип экспорта''' <br />
*'''One project file''' - формируется один XML файл описывающий проект. Рекомендуется использовать второй тип при значительных размерах проекта.<br />
<br />
*'''Split project on screens, load partly''' - проект будет разбит на отдельные файлы описывающие экраны, загружаться файлы будут в порядке использования (вызова) в проекте. В результате получаем увеличение начальной загрузки проекта и использование меньшего объема оперативной памяти.<br />
<br />
'''Параметры запаковки графики'''<br />
*'''Packege Type''' - упаковка ресурсов в фаил с типом DAT. Обеспечиваем защиту ресурсов проекта от несанкционированного доступа. Увеличиваем производительность при операциях чтения файлов ресурсов с твердотельного носителя.<br />
*'''Texture Type''' - упаковка графических файлов в текстуры. Необходимо для уменьшения используемого объема оперативной памяти.<br />
<br />
'''Export to folder''' - Путь для экспорта. Для создания папки с экспортом необходимо указать любой путь (папку) на диске. Будет создана папка [[Файл:Proj_folder.png]]<br />
<br />
Структура папки:<br />
<br />
[[Файл:TreeFolder.png]]<br />
<br />
'''Select platform''' - необходимо выбрать платформу для которой будем собирать проект. <br />
<br />
'''Примечание:''' ''Для сборки под различный платформы необходимо установить Marmalade SDK'' [[Установка и настройка|см. инструкцию]] <br />
при этом не нужно указывать путь для экспорта (оставить поле пустым). В результате запустится скрипт сборки исполняемого пакета, <br />
это будет видно по черным экранам с ходом выполнения процесса сборки.<br />
<br />
'''Итак:''' Сохраняем открытый проект с выполненными уроками <tt>Project</tt> &rarr; <tt>Export</tt> настраиваем параметры как показано на картинке<br />
<br />
[[Файл:Export_window.png]]<br />
<br />
Нажимаем кнопку <tt>Ok</tt> и ждем несколько минут. <br />
Процесс экспорта будет отображаться в окне<br />
<br />
[[Файл:Export_progres.png]]<br />
<br />
В результате экспорта у вас должно открыться приложение iTunes с добавленным проектом Absolutist с иконкой [[Файл:114.png|50px]]<br />
<br />
'''Поздравляю Вы это сделали!!'''<br />
<br />
Если вы не получили ожидаемого результата необходимо проверить следующее:<br />
# Для сборки пакетов под iPhone платформу вы должны иметь сертификат разработчика<br />
# Проверить ход выполнения настройки по [[Установка и настройка|см. инструкцию]]<br />
# Проверить и\или установить iTunes<br />
<br />
Если вы обладатель мобильного устройства на системе Android необходимо указать ''Android'' в разделе '''Select platform''' и вы получите фаил absolutist.apk<br />
<br />
'''Поздравляю Вы это сделали!!'''<br />
<br />
== Упражнения ==<br />
<br />
* Настройте параметры viever.xml для корректной работы на вашем мобильном устройстве (если конечно оно у вас есть)<br />
* Настройте параметры viever.xml для системы Windows под рабочий монитор<br />
* Определите какое разрешение для ваших игр наиболее подходящее<br />
* Создайте проект для вашего мобильного устройства <br />
<br />
<br />
----<br />
{| width="100%" <br />
| width="40%"|[[Работа с эффектами|Урок 9]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Создание простой адвентюры|Урок 11]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=Puzzle&diff=9820Puzzle2019-07-29T10:39:24Z<p>Apolozova: </p>
<hr />
<div>{{TOC right}}<br />
<br />
[[Файл:puzzle1.png|right]]<br />
'''Пазл''' (puzzle) — встроенный [[Object|объект]] редактора, имеющий определенную игровую механику, которая заключается в том, чтобы собрать необходимое изображение из прямоугольных ячеек (частей) за минимальное количество шагов (перемещений частей пазла). <br><br />
<br />
== Немного о графике ==<br />
Для придания ячейкам объема служит графический ресурс рамка (собственный бордюр ячейки). Он может быть квадратной картинкой, прозрачной в центре и с серой полупрозрачной маской на краях. Её размер особой роли не играет. Например, 128x128:<br />
<br />
[[Файл:border.png|right]]<br />
Общая ширина и высота картинки пазла задает игровое поле. Кроме этого есть поля ширина пазла и высота пазла, которые определяют размер центральной области картинки, которая разбивается на ячейки. Если эта область меньше размеров картинки, появится внешний бордюр, помогающий при сборке.<br />
<br />
== Игровые механики и режимы пазла ==<br />
*Ячейки пазла можно переставлять и вращать. По мере сбора пазла ячейки, оказывающиеся на своем месте, лишаются собственного бордюра и пазл постепенно проявляется <br><br />
*У пазла может быть внешний бордюр (часть исходного изображения), который не разрезается на части и помогает при сборке. <br />
* Пазл может быть увеличен и снова уменьшен<br><br />
<br />
Возможны две игровые механики пазла: <br><br />
* обычная - все ячейки есть на игровом поле<br><br />
* пятнашки - одной ячейки нет (аналог обычных пятнашек). <br><br />
<br />
'''''Замечание.''''' Чтобы корректно работала механика "пятнашки", в правилах нужно указать значение 1 для параметров "переставлять?" и "пятнашки". Если в "переставлять?" будет значение 0, то пазл будет запускаться с механикой "пятнашки", но уже в собранном виде.<br />
<br />
Существует три уровня сложности сбора пазла с обычной механикой :<br />
* Легкий<br />
* Эксперт<br />
* Мастер<br />
Режим «Эксперт» отличается от режима «Легкий» количеством ячеек, на которые разбивается исходное изображение (в режиме «Эксперт» их больше). <br><br />
В режиме мастер столько же ячеек, сколько и в режиме эксперт, лишь добавлена возможность поворота ячеек по часовой стрелке вокруг своих центров (подробнее см. описание поворота в разделе параметры). Ячейка пазла поворачивается при повторном клике на нее мышью. <br><br />
<br />
== Важное замечание ==<br />
В процессе сбора пазла на устройство сохраняются файлы, в которые записывается информация о ходе игры (какие пазлики на месте, а какие - нет). Структура имени файла, сохраняемого на устройство p<id_картинки>_<rows>_<cols>.puz (например p107_6_8.puz) . <br><br />
При повторном сборе пазла или повторном открытии загружается информация из этих файлов, т.е. мы увидим то же состояние пазла, что и перед выходом с этого экрана. Рекомендуется создать кнопку, дающую пользователю возможность начать игру с начала. . <br><br />
<br />
== Основные параметры пазла ==<br />
''(Курсивом в скобках указан id параметра, или состояния)''<br />
<br />
'''Группа - внешний вид'''<br />
*'''Картинка''' ''(res)'' — это исходное изображение (графический ресурс) которое нужно собрать;<br />
*'''Колонок''' ''(cols)'' — количество колонок, на которые разбивается картинка;<br />
*'''Строчек''' ''(rows)'' — количество строчек (рядов), на которые разбивается картинка;<br />
*'''Сетка?''' ''(g)'' — отображение сетки:<br />
:'''1''' — отображается сетка после разделения картинки на ячейки,<br />
:'''0''' — сетка не отображается;<br />
*'''Пометка''' ''(alChk)'' — прозрачность выбранной ячейки пазла в диапазоне от нуля (полностью прозрачна, или невидима) до единицы (полностью не прозрачна, или видима);<br />
*'''Фон''' ''(alBkg)'' — прозрачность (от нуля до единицы) исходной картинки, отображаемой под пазлом в игровом поле;<br />
*'''Ширина пазла''' ''(vW)'' — размер ширины игрового поля в пикселях;<br />
*'''Высота пазла''' ''(vH)'' — размер высоты игрового поля в пикселях;<br />
*'''Маска''' ''(msk)'' — графический ресурс (изображение), которое накладывается на картинку (например текстура для придания изображению рельефности);<br />
*'''Рамка''' ''(fr)'' — графический ресурс для рамки по краям ячейки;<br />
*'''Рамка активной''' ''(fra)'' — графический ресурс для рамки вокруг активной ячейки;<br />
*'''Рамка соседей''' ''(frn)'' — графический ресурс для рамок вокруг соседних ячеек;<br />
*'''Флаер''' ''(fly)'' — флаер (подробнее см. объект редактора [http://ge.absolutist.com/index.php/Flyer «флаер»]), изображающий удачный ход. Он будет запущен над ячейкой которая встала на свое место.<br />
<br />
<br />
'''Группа - звуки''' ''(Звуковые ресурсы перетаскивается мышью из редактора ресурсов в поле параметра, которое должно находится в состоянии редактирования))''<br />
*'''Выбор''' ''(sDn)'' — звук при выборе ячейки;<br />
*'''Перестановка''' ''(sSh)'' — звук при перестановке ячеек;<br />
*'''На месте''' ''(sOk)'' — звук при становлении ячейки на нужное место.<br />
<br />
<br />
'''Группа - смешивать'''<br />
*'''Перестановку''' ''(alSwp)'' — при поочередном выборе ячеек кликом мыши для перестановки, возможны два варианта визуализации этого процесса: <br />
:'''1''' — ячейки остаются неподвижными, изменяются лишь их изображения по прозрачности (от нуля до единицы);<br />
:'''0''' — происходит перемещение ячеек (ячейки меняются местами);<br />
*'''Вращение''' ''(alRot)'' — визуализацию поворот ячейки в режиме «мастер» возможно осуществить двумя способами: <br />
:'''1''' — ячейка остается неподвижной, изменяется лишь ее изображение по прозрачности (от нуля до единицы); <br />
:'''0''' — происходит поворот ячейки.<br />
<br />
<br />
'''Группа - правила'''<br />
*'''Вращений''' ''(rot)'' — число возможных поворотов каждой ячейки пазла:<br />
:'''0''' — ячейки повернуть нельзя; <br />
:'''2''' — два варианта положения ячейки, или поворот на 180°; <br />
:'''4''' — четыре варианта положения ячейки, или поворот на 90°;<br />
*'''Переставлять?''' ''(swp)'' — переставление ячеек местами путем поочередного выбора их мышью:<br />
:'''0''' — нельзя, <br />
:'''1''' — можно;<br />
*'''Пятнашки''' ''(fif)'' — механика игры:<br />
:'''0''' — обычная механика игры,<br />
:'''1''' — играем в пятнашки (см. игровые механики и режимы пазла);<br />
*'''Соседи''' ''(nei)'' — какие ячейки можно переставлять:<br />
:'''0''' - переставлять можно любые ячейки, <br />
:'''1''' — переставлять можно только соседние элементы.<br />
*'''Таскать''' ''(is_drag)'' — ячейки смениваются только поочередными кликами или еще дропом одну на другую:<br />
:'''0''' - нельзя, <br />
:'''1''' — можно.<br />
<br />
<br />
'''Группа - времена этапов'''<br />
*'''Невидимости''' ''(tmBeg)'' — время паузы перед открытием пазла;<br />
*'''Открытия''' ''(tmOpn)'' — время открытия картинки;<br />
*'''Показа''' ''(tmStt)'' — время отображения картинки перед тем, как она разделится на ячейки и перемешается. Это необходимо для того, чтобы игрок успел ознакомиться с изображением, которое ему необходимо собрать;<br />
*'''Перемешивания''' ''(tmMix)'' — время визуализации процесса перемешивания ячеек пазла;<br />
*'''Финала''' ''(tmFin)'' — время показа картинки когда она собрана. Это необходимо для того, чтобы игрок смог насладиться результатом своих стараний, а также смог повнимательнее разглядеть картинку;<br />
*'''Закрытия''' ''(tmCls)'' — время закрытия пазла (переход в состояние (close) по прозрачности (alpha) от единицы до нуля).<br />
<br />
<br />
'''Группа - счетчики'''<br />
*'''Таймер''' ''(timer)'' — объект редактора [http://ge.absolutist.com/index.php/Timer «timer»] привязывается к пазлу и дает возможность собирать пазл определенное время, или использовать его для спортивного интереса, фиксируя время, за которое игрок соберет пазл. Таким образом игрок сможет с гордостью заявить своим друзьям, что он собрал пазл за такое-то время;<br />
*'''Лучшее время''' ''(tmBest)'' — самое короткое время, за которое игрок собрал пазл. Оно считается лучшим и фиксируется в опциях для использования в прогрессе (см. объект редактора «progress»);<br />
*'''Счетчик''' ''(count)'' — объект редактора [http://ge.absolutist.com/index.php/Counter «counter»] привязывается к пазлу и фиксирует количество ходов;<br />
*'''Лучший счетчик''' ''(ctBest)'' — наименьшее количество ходов за которое пазл собран. Оно считается лучшим и фиксируется в опциях для использования в прогрессе;<br />
*'''Показов хинт счетчик''' ''(cntShw)'' — объект редактора «counter» привязывается к пазлу и фиксирует количество оставшихся подсказок-отображения (hint), тип подсказки когда картинка отображается на некоторое время;<br />
*'''Перест. хинт счетчик''' ''(cntSwp)'' — объект редактора «counter» привязывается к пазлу и фиксирует количество оставшихся подсказок-перестановки (swap), тип подсказки когда выделенная, или произвольная ячейка становится на свое место;<br />
*'''Игра''' ''(game)'' — имя игры, раздел в опциях, который надо вычитать для получения начального значения прогресса (например, для отображения результатов);<br />
*'''Уровень''' ''(level)'' — имя уровня, параметра в разделе игра (см. выше), который надо вычитать для получения начального значения прогресса (например, для отображения результатов). В опциях записывается как «имя игры».«имя уровня» (game.level);<br />
*'''Сохранять в профиль''' ''(prof)'' — сохранение значений в профиль:<br />
:'''1''' — все значения будут сохранены в текущий профиль,<br />
:'''0''' — глобально.<br />
<br />
Хозяйке на заметку:<br />
таким образом, с пазлом может быть связан таймер и три счетчика (числа ходов, и числа использования двух видов<br />
подсказок). Если, например, счетчик числа ходов определен, в опциях (файл options.xml) сохраняются данные подобного вида:<br />
<br />
<obj nm="options" ><br />
<pk1><br />
<pz01 lv0="2" lv0ct="7" /><br />
</pk1><br />
</obj><br />
</pre><br />
<br />
В этом примере параметр «игра» записывается как «pk1.pz01», а параметр «уровень» — «lv0». Эти параметры могут быть заданы как в<br />
свойствах пазла, так и внешними объектами. Наличие точки в параметре «игра» разбивает раздел опций на подразделы.<br />
<br />
<br />
'''Группа - времена игры'''<br />
*'''Перестановки''' ''(tmSwp)'' — время перестановки двух ячеек местами;<br />
*'''Поворота''' ''(tmRot)'' — время поворота ячейки;<br />
*'''Паузы''' ''(tmShw)'' — время паузы перед началом перестановки или поворота;<br />
*'''Подсказки1''' ''(tmHnt1)'' — время за которое проявляется исходная картинка в состоянии (hint);<br />
*'''Подсказки2''' ''(tmHnt2)'' — время в течении которого показывается исходная картинка в состоянии (hint) после проявления;<br />
*'''Подсказки3''' ''(tmHnt3)'' — время в течении которого закрывается исходная картинка в состоянии (hint) после проявления.<br />
<br />
*'''Рейтинг''' ''(raiting)'' — если 1 — после того как пазл собран, отображается рейтинг.<br />
<br />
== Подсказки ==<br />
В игре есть два вида подсказок: ''(hint)'' и ''(swap)''. Первый проявляет исходную картинку, второй переставляет две ячейки местами, из которых, по крайней мере одна, окажется на своем месте. <br />
Если кнопкой или машиной состояний перевести пазл в состояние ''(hint)'', то он исчезнет по прозрачности (за время ''tmHnt1''), а исходная картинка проявится. Затем, в течении ''(tmHnt2)'', будет демонстрироваться исходная картинка, и за время ''(tmHnt3)'', она по прозрачности исчезнет, а пазл снова перейдет в стадию игры.<br />
Состояние ''(swap)'' ставит одну из ячеек (выделенную игроком, или произвольную) на свое место. <br />
Кроме этого пазл можно перевести в состояние ''(scale)''. В этом состоянии он увеличивается в размерах и его можно таскать по экрану. Повторение состояния ''(scale)'' уменьшает возвращает пазлу исходные размеры.<br />
<br />
== Добавляемые параметры ==<br />
<br />
<br />
[[Файл:Paz add par.jpg|right]]<br />
Меню выбора ''Добавляемые параметры'' к объектам активируется по правой кнопки мыши. <br />
<br />
[[Файл:+.png]] '''Изменить состояние объекта''' - После разбора перевести объект в новое состояние.<br />
*'''объект'''- после разбора перевести объект в состояние из следующего поля. <br />
*'''состояние''' - новое состояние для объекта из предыдущего поля. <br />
<br />
[[Файл:+.png]] '''Изменить параметр объекта''' - После разбора изменить параметр объекта.<br />
*'''объект'''- после разбора этот объект меняет свой параметр. <br />
*'''свойство''' - параметр, который мы изменяем.<br />
*'''значение''' - новое значение параметра.<br />
<br />
[[Файл:+.png]] '''Хинт запущен: изменить состояние объекта''' - перевести объект в состояние, при начале хинта ( включить маску).<br />
*'''объект'''- после разбора перевести объект в состояние из следующего поля. <br />
*'''состояние''' - новое состояние для объекта из предыдущего поля. <br />
<br />
[[Файл:+.png]] '''Хинт завершён: изменить состояние объекта''' - перевести объект в состояние, после завершения хинта ( разблокировать маску).<br />
*'''объект'''- после разбора перевести объект в состояние из следующего поля. <br />
*'''состояние''' - новое состояние для объекта из предыдущего поля.<br />
<br />
== Возможные состояния объекта ==<br />
<br />
:''(beg)'' — пауза перед состоянием ''(open)'';<br />
:''(open)'' — картинка появляется по прозрачности от нуля до единицы;<br />
:''(start)'' — начальный показ картинки;<br />
:''(mix)'' — перемещать ячейки;<br />
:''(scale)'' — масштабирование (изменение размера) пазла;<br />
:''(wait)'' — ожидание первого клика на ячейку;<br />
:''(check)'' — проверка собранности пазла, если собран — переход в состояние ''(final)'';<br />
:''(hint)'' — временное отображение картинки;<br />
:''(swap)'' — выделенная, или произвольная ячейка становится на свое место;<br />
:''(final)'' — показ картинки в конце игры;<br />
:''(close)'' — закрытие пазла по прозрачности;<br />
:''(end)'' — конец игры, пазл недоступен;<br />
:''(init)'' — повторная инициализация картинки, переход в состояние ''(beg)''.<br />
<br />
== Пример ==<br />
Объект «Пазл» в редакторе выглядит так:<br />
<br />
[[Файл:01.JPG]]<br />
<br />
<br />
Картинку пазла можно задать, перетянув изображение из редактора ресурсов в поле «картинка»:<br />
<br />
[[Файл:02.JPG]]<br />
<br />
<br />
либо с помощью другого объекта (например кнопкой, или машиной):<br />
<br />
[[Файл:6.2.JPG]]<br />
<br />
<br />
Выбор сложности игры делается отдельным экраном, на котором есть кнопки которые меняют параметры пазла:<br />
<br />
[[Файл:6.3.JPG]]<br />
<br />
<br />
Выбор сложности на устройстве:<br />
<br />
[[Файл:6.3.1.JPG]]<br />
<br />
<br />
И, наконец, пазл на устройстве выглядит примерно так:<br />
<br />
[[Файл:6.4.JPG]]<br />
== Пример ==<br />
<br />
[http://fs5.absolutist.com/files/wikisample/Puzzle.rar Download]<br />
<br />
[[Category:Game mechanic]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0_%D0%BC%D0%B8%D0%BD%D0%B8%D0%B8%D0%B3%D1%80&diff=9819Настройка миниигр2019-07-29T10:38:11Z<p>Apolozova: </p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Создание игры «Hidden Object Game»|Урок 7]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Работа с эффектами|Урок 9]]<br />
|}<br />
----<br />
{{TOC right}}<br />
<br />
'''Цель:''' изучить настройки объектов, реализующих различные минигры.<br />
<br />
'''Задачи:''' <br />
* создать уровень игры с объектом, содержащим тип механики Puzzle<br />
* создать уровень игры с объектом, содержащим тип механики Patchwork <br />
<br />
== Puzzle ==<br />
<br />
=== Создание экрана и сцены в игровом проекте ===<br />
<br />
1. Запустить SceneEditor.<br />
<br />
2. В меню Проект → Загрузить → Learning.seproj. <br />
<br />
3. Кликнув правой кнопкой мыши по ранее созданному экрану Lesson_07.1, создать экран Lesson_08.<br />
<br />
[[Файл:08 1.png]]<br />
<br />
4. В экране Lesson_08 создать новые сцены 08 и Buttons, в которую (через ResourcesEditor) добавить графические ресурсы (Level_01, hint_normal в сцену 05 и hint_normal, ico_R_normal2 сцену Buttons) из папки Sources\Lesson_08 (см. подготовка к работе «Создание проекта»).<br />
<br />
[[Файл:08 2.png]] [[Файл:08 3.png]]<br />
<br />
=== Настройка объектов, создание машин состояний ===<br />
<br />
1. В сцене 08 изменить название графического ресурса hint_normal на applause и в общих настройках элемента удалить саму графику через модификаторы → res.<br />
<br />
[[Файл:08 4.png]]<br />
<br />
2. Графическое изображение level_01 перевести в тип [[Puzzle|puzzle]] и установить такие настройки:<br />
<br />
[[Файл:08 5.png]]<br />
<br />
3. Объект applause перевести в тип машина и прописать ему состояния on и off.<br />
<br />
4. В состоянии on добавить команду play (проиграть звук) и в списке команды выбрать snd (короткий звук), подгружаемый с помощью ResourcesEditor из папки ресурсов Level_08; <br />
<br />
[[Файл:08 6.png]]<br />
<br />
5. Создать новое состояние с именем off. В общих настройка свойства элемента изначально установить состояние off.<br />
<br />
[[Файл:08 7.png]] [[Файл:08 8.png]]<br />
<br />
6. Далее перейти к сцене Buttons, перевести графические объекты hint_normal, ico_R_normal2 в тип button, в свойстве элемента установить такие настройки:<br />
<br />
[[Файл:08 9.png]] [[Файл:08 10.png]]<br />
<br />
''Кнопка R (переиграть)'' — кнопка, запускающая игру Puzzle сначала. В общих настройках свойства элемента устанавливаем, в какое начало должна возвращать кнопка (в нашем случае перейти на экран Lesson_08).Для данной игры, мы сделали переход на экран <tt>Lesson_08</tt>, который запускает игру сначала. Но в дальнейшем, чтобы не переводить все объекты в начальное состояние правильнее будет, в графе '''«изменить состояние»''' выбрать объект <tt>Level_01</tt> и указать ему состояние <tt>mix</tt>, которое означает, что игра возвращается в состояние перемешивания картинок, а не запускает всю игру заново.<br />
<br />
7. В объекте (кнопке) hint_normal нажать правой кнопкой и выбрать изменить состояние объекта → потом выбрать объект level_01 и вписать состояние hint, которое означает, что при нажатии кнопки, в качестве подсказки, игра покажет картинку в собранном виде.<br />
<br />
[[Файл:08 11.png]] [[Файл:08 12.png]]<br />
<br />
''hint'' – кнопка, реализующая подсказку на экране поиска.<br />
<br />
8. Вернуться на сцену 08 к объекту level_01 и в общих настройках свойства элемента изменить состояние объекта → выбрать объект applause и вписать состояние on.<br />
<br />
[[Файл:08 13.png]]<br />
<br />
9. Проверить выполнение задачи с помощью проигрывателя сцен Viewer.<br />
<br />
=== Упражнения ===<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_08, создать новый экран Lesson_08.1<br />
<br />
2. Создать новые сцены (с названием 08.1 и Buttons).<br />
<br />
3. Скопировать все объекты из сцены 08 (экрана Lesson_08) и Buttons (экрана Lesson_08).<br />
<br />
4. Вставить скопированые объекты в новую сцену 08.1 и Buttons (экрана Lesson_08.1).<br />
<br />
[[Файл:08 15.png]]<br />
<br />
5. В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) заменить звук аплодисментов другим аудиофайлом, имеющимся в базе ресурсов;<br />
<br />
b) в пазле изменить количество разбиваемых частей на шесть (3х2), добавить сетку, изменить перестановку ячеек на смешивание по alpha, изменить время смешивания на 500 миллисекунд;<br />
<br />
c) при нажатии hint (подсказки) изменить время показа подсказки на 2 секунды, изменить время финального показа пазла на 3 секунды, установить время закрытия пазла 500 миллисекунд.<br />
<br />
6. Сделать счетчик подсказок, используя объект '''[[Store|Store]]''' создать возможность совершать покупки подсказок за реальные деньги. Использовать для открытия окна покупки подсказки объект '''[[Statesmanager]]'''<br />
<br />
Щелкнув правой кнопкой мыши по экрану Lesson_08.1 создадим новый экран '''lessons_8_1_1'''. Добавим в него сцены str_8_1 и Button_8_1. В сцену str_8_1 поместим объекты из экрана Lesson_08.1: level_01, applause; оставим их без изменения. В сцену Button_8_1 скопируем из Lesson_08.1 кнопки hint_normal и ico_R_normal2 и создадим новый объект, поменяв ему тип на '''counter''' (счетчик) и названия на '''hint'''. Добавим ресурс из базы ресурсов — анимацию file1 (brown_big). Счетчик hint будет считывать купленные подсказки.<br />
<br />
[[Файл:Hint counter na max.png]]<br />
<br />
В hint_normal добавим подобъект, сделаем его машиной и назовем '''hint_m'''.<br />
<br />
Щелкнув правой кнопкой мыши на сцену Button_8_1 создадим новые сцены store и error, которые, соответственно, будут предназначены для совершения покупок — начисления подсказок и окна с ошибкой при невозможности купить подсказку.<br />
<br />
В сцену store добавим две машины: '''buy''' и '''store'''; в error - машину '''error'''.<br />
<br />
[[Файл:8 1 1 .PNG]]<br />
<br />
Для машины buy зададим состояния, при котором значении параметра hint=1, то есть она начисляет подсказку:<br />
<br />
[[Файл:Buy na max.png]]<br />
<br />
Соответственно в машине store зададим считывания со счетчика и прозрачность экрана:<br />
<br />
[[Файл:Store.PNG]]<br />
<br />
Машина error будет отвечать за вывод ошибки при неудачной покупке, то есть задает прозрачность экрана с ошибкой<br />
<br />
[[Файл:Error.PNG]]<br />
<br />
Вернемся к машине hint_m сцены Button_8_1 и пропишем для нее состояния. Машина отвечает за начисление подсказки при удачной покупке<br />
<br />
[[Файл:Hint m.PNG|800px]]<br />
<br />
Для того, что бы вызывать машину hint_m в нашей игре, откроем кнопку hint_normal и в свойстве "изменить состояние объекта" в качестве объекта выберем машину hint_m, и пропишем ей состояние check.<br />
<br />
'''Совершение покупки'''<br />
<br />
Для того что бы покупку можно было совершить необходимо задать в глобальных свойствах возможность совершения покупки. Для этого на сцене в глобальном экране opt добавим новый элемент, которому изменим тип на store. В свойствах объекта store кликнем правой кнопкой мыши на свойстве wallet, вставляем новое свойство — '''in-app покупка'''. Добавляем поля для покупки: внутренний id, и выбираем расходуемая.<br />
<br />
[[Файл:Store2.PNG]]<br />
<br />
<br />
'''Описание объекта Store'''<br />
<br />
Объект '''Store''' необходим для описания InApp покупок (позволяют продавать отдельные бонусы, паки и т.п.) в игре.<br />
<br />
Основные параметры объекта Store<br />
<br />
''id покупки'' – внутренний id покупки.<br />
<br />
''Расходуемая'' – 1 – покупка расходуемая, 0 – покупка раз и навсегда, если параметр не указан, по-умолчанию покупка – одноразовая.<br />
<br />
''объект (restore)'' – объект - Слушатель восстановления покупки. Этому объекту будет сообщено об успехе восстановления этой покупки покупки.<br />
состояние (restore) – это состояние будет установлено объекту при успешном восстановлении этой покупки.<br />
<br />
'''Для того, чтобы объект Store работал во Вьювере, нужно подкорректировать файл app.icf'''<br />
<br />
1. Найти файл app.icf в папке с вашим проектом.<br />
<br />
2. Открыть его и найти тег [Game].<br />
<br />
3. В теге Game добавить строку purchaseEverything=1.<br />
<br />
4. Сохранить файл<br />
<br />
<pre><br />
<br />
[Game]<br />
purchaseEverything=1<br />
DispFixRot="Landscape"<br />
# comments and whitespace stripped by deployment tool<br />
debug="Absolutist-2253"<br />
show_build_date=1<br />
AppTitle="Viewer"<br />
DebuggerIP="127.0.0.1"<br />
DebuggerPort=5322<br />
<br />
</pre><br />
<br />
<br />
<br />
'''Оформление'''<br />
<br />
Теперь перейдем к оформлению. Для того что бы на экране появлялось окно с предложением о покупке подсказке необходимо его создать. В начальный момент оно должно быть невидимым и прокликиваем, это состояние задано в машине store. Создадим в ней 5 подобъектов.<br />
<br />
<br />
1.1. Первые два переименуем в '''black''' и '''rec''', изменим им тип на '''[[Rectangle|Rectangle]]'''.<br />
<br />
Откроем объект black, пропишем ему свойствах, оставив его пустым рамку, и цвет фона<br />
<br />
[[Файл:Black.PNG]]<br />
<br />
Для объекта rec зададим рамку и текстуру заливки. Для этого из базы ресурсов мышкой перетащим соответствующие элементы. Ресурсы для графики находятся в предыдущем уроке. Чтобы прямоугольник отображался правильно, задайте ему ненулевые размеры.<br />
<br />
[[Файл:Rec.PNG]]<br />
<br />
Чтобы прямоугольник отображался правильно, задайте ему ненулевые параметры размера.<br />
<br />
1.2. Третьему элементу поменяем тип на text с текстом<br />
<br />
[[Файл:Text.PNG]]<br />
<br />
<br />
1.3. Четвертый и пятый объекты сделаем кнопками, и назовем их '''ok''' – купить подсказку, '''no''' – отказаться от покупки. <br />
<br />
Для кнопки ok из базы ресурсов выберем внешний вид<br />
<br />
[[Файл:Ok1.PNG]]<br />
<br />
и зададим переход на совершение или провал покупки. Для этого кликнем правой кнопкой мыши на свойстве позиционирование и добавим свойство совершить in-app покупку, заполним для нее поля как указано на картинки<br />
<br />
[[Файл:Ok2.PNG]]<br />
<br />
Аналогично поступим с кнопкой no. Добавим графический ресурс и свойство «изменить состояние объекта», которое будет закрывать окно с предложением о покупке<br />
<br />
[[Файл:No1.PNG]] [[Файл:No2.PNG]]<br />
<br />
<br />
2. Так же сделаем со сценой error. В ней создадим четыре объекта: два rectangle: '''rec_error''' – пустой, '''black_error''' — оформленный в такую же рамку; кнопку '''buy''', которая будет делать активным состояние error; текстовый объект '''text_error''' с текстом «error!»<br />
<br />
[[Файл:Buy1.PNG]]<br />
<br />
Разместим все объекты так, что бы картинка хорошо смотрелась. Сохраним все изменения и запустим вьювер. <br />
<br />
[[Файл:Снимок1.PNG]] <br />
<br />
Сейчас при покупке подсказки количество покупок не имеет лимита, по этому вывод ошибки мы не получим. Этот параметр в реальной игре будет реализован с помощью объекта store, заданием ему соответствующих свойств.<br />
<br />
== Patchwork ==<br />
<br />
=== Создание экрана и сцены в игровом проекте ===<br />
<br />
1. Запустить SceneEditor.<br />
<br />
2. В меню Проект → Загрузить → Learning.seproj. <br />
<br />
3. Кликнув правой кнопкой мыши по ранее созданному экрану Lesson_08.1, создать экран Lesson_08.2.<br />
<br />
[[Файл:Lesson8_1.jpg|right]]<br />
<br />
4. В экране Lesson_08.2 создать новую сцену 08, в которую (через ResourcesEditor) добавить графические ресурсы (bg_game, panel_down, btb_replay_normal) из папки Sources\Lesson_08 (см. подготовка к работе «Создание проекта»). В редактор ресурсов добавить графику нашего будущего Patchwork: level_17, level_17_mask.<br />
<br />
=== Настройка объектов ===<br />
<br />
1. Создадим на сцене 08 еще два объекта. Для этого нажмем правой кнопкой мыши по сцене и выберем "Создать объект в текущем элементе".<br />
<br />
[[Файл:Lesson8_2.jpg]]<br />
<br />
2. Переименуем один из созданных объектов в Patchwork, а другой в table.<br />
<br />
[[Файл:Lesson8_3.jpg]]<br />
<br />
[[Файл:Lesson8_4.jpg|right]]<br />
<br />
3. Теперь будем изменять тип объектов на сцене, чтобы получить нужные нам элементы. Графические ресурсы bg_game и panel_down оставляем без изменений. Ресурсу btb_replay_normal изменяем тип на button. Объекту Patchwork меняем тип на patchwork, table изменяем на тип table.<br />
4. Теперь объекты нужно разместить на сцене. Обратим внимание на то, что два последних объекта которые мы добавили без графического ресурса. По умолчанию, создаваемые на сцене объекты имеют размер 100х100 пикселей. Увеличим размер таблицы по высоте до 450 пикселей и перетащим ее влево, поместив над объектом panel_down.<br />
<br />
[[Файл:Lesson8_5.jpg]]<br />
<br />
Кнопку поместим в левый нижний угол. Добиваемся такого расположения объектов, как показанно на рисунке.<br />
<br />
[[Файл:Lesson8_6.jpg]]<br />
<br />
5. Настроим наши объекты. Для кнопки btb_replay_normal в поле "перейти на" укажите текущий экран Lesson_8.2.<br />
<br />
<br />
[[Файл:правка_намба_1.png|200px]]<br />
<br />
<br />
Для таблицы измените следующие параметры<br />
<br />
[[Файл:lesson8_table_setup.png|200px]]<br />
<br />
<br />
Для Patchwork устанавливаем следующие настройки. Обратите внимание, что поля "карт.спереди" и "шаблон" заполняются перетаскиванием графического ресурса из редактора ресурсов.<br />
<br />
[[Файл:Lesson8_9.jpg]]<br />
<br />
6. Для корректной работы вашего Patchwork необходимо, чтобы таблица находилась выше Patchwork по дереву объектов.<br />
<br />
[[Файл:Lesson8_10.jpg]]<br />
<br />
<br />
7. Проверьте выполнение задачи с помощью проигрывателя сцен Viewer.<br />
<br />
[[Файл:Lesson8.3.Fin.png]]<br />
<br />
=== Упражнения ===<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_08.2, создать новый экран Lesson_08.3<br />
<br />
2. Создать новую сцену с названием game.<br />
<br />
3. Скопировать все объекты из сцены 08 (экрана Lesson_08.2).<br />
<br />
4. Вставить скопированые объекты в новую сцену game (экрана Lesson_08.3).<br />
<br />
5. В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) заменить картинку пэчворка и маски на другую, имеющуюся в базе ресурсов;<br />
<br />
b) изменить настройки кнопки рестарта таким образом, чтобы не переходить на экран Lesson_08.3, а сразу передавать пэчворку состояние mix.<br />
----<br />
{| width="100%" <br />
| width="40%"|[[Создание игры «Hidden Object Game»|Урок 7]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Работа с эффектами|Урок 9]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%92%D0%B2%D0%B5%D0%B4%D0%B5%D0%BD%D0%B8%D0%B5_%D0%B2_AppSalute_%D0%A1reator&diff=9818Введение в AppSalute Сreator2019-07-29T10:36:29Z<p>Apolozova: </p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Learning|Оглавление]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Создание экранов, сцен. Работа с кнопками|Урок 2]]<br />
|}<br />
----<br />
{{TOC right}}<br />
----<br />
'''Цель:''' <br />
познакомиться со средой разработки игр AppSalute Сreator.<br />
<br />
'''Задачи:''' <br />
* проинсталлировать AppSalute Сreator;<br />
* открыть готовый проект в редакторе сцен;<br />
* освоить взаимодействие редактора сцен и редактора ресурсов;<br />
* изучить основные методы редактирования сцены.<br />
<br />
<br />
== Введение ==<br />
Для начала работы с редактором его необходимо [[Установка и настройка|установить]], загрузив и запустив [[Downloads|инсталлятор]].<br />
По умолчанию все необходимые программы будут размещены '''C:\Program Files\AppSalute Creator''' и материалы для уроков находятся в папке '''Мои Документы\Absolutist\Projects\lessons'''. При желании её можно в дальнейшем перенести в любое удобное место.<br />
После инсталляции запускаем программу Scene Editor, найдя на рабочем столе или в списке приложений иконку:<br />
<br />
[[Файл:icon_se.png]].<br />
<br />
Для создания игр в AppSalute Сreator используются четыре взаимодействующих между собой приложения:<br />
* [[Файл:Ico_main.png|40px]] '''[[Интерфейс ScenceEditor|Scene Editor]]''' - редактор игровых сцен (экранов), в котором происходит настройка свойств объектов и игровой логики. Это основной инструмент при разработке игры.<br />
* [[Файл:Ico_base.png|40px]] '''[[Редактор ресурсов|Resources Editor]]''' - хранилище медиа-ресурсов (картинки, звуки, видео, анимация), использующихся в игре. Эти ресурсы при помощи мышки перетаскиваются на сцену в Scene Editor.<br />
* [[Файл:Ico_text.png|40px]] '''[[Интерфейс TextEditor|Text Editor]]''' - хранилище всех текстовых ресурсов (надписей) на различных языках. Аналогично графике и звукам при помощи мышки они перетаскиваются в соответствующие свойства объектов, находящихся в Scene Editor. См. также [[Редактор текстовых ресурсов|Урок 6]]<br />
* '''Viewer''' - проигрыватель созданной игры. Обычно запускается непосредственно из Scene Editor. Вы увидите, возможно сыграете, игру в том же виде, как и на любом мобильном устройстве.<br />
<br />
[[Файл:Layout.png|right]]<br />
Игра состоит из набора '''экранов'''. На каждом экране может находиться одна или несколько '''сцен'''.<br />
Например, пусть на экране находится игровое поле и панель с интерфейсными кнопками. Эти две области можно оформить при помощи различных сцен. Первая сцена содержит игровые '''объекты''' редактора, например миниигры такие как puzzle и фоновую картинку. Вторая сцена содержит базовые элементы управления (кнопки, чекбоксы), универсальные машины состояний (программирующие логику) и т.д. <br />
<br />
Так как игра обычно запускается на различных устройствах (телефон, планшетник, десктоп), важным понятием является '''лейаут''' (layout). Лейаут - размещение элементов игры на экране. Так как мониторы имеют разное разрешение в пикселях и разное соотношение высоты и ширины, для них нужны разные варианты размещения игровых объектов и интерфейса. Если игра проектируется для разных устройств, должны поддерживаться несколько лейаутов.<br />
<br />
[[Файл:lesson_1_layouts.png|400px]]<br />
<br />
В качестве примера справа на рисунке представлена структура некоторого проекта в лейауте с размерами экрана устройства 960x640 пикселей. На этом лейауте находятся экраны, из которых только один экран (pack1) развернут. Внутри него находятся 2 сцены (stg_list1 и stg_main1). Одна сцена (stg_list1) раскрыта и содержит три игровых объекта. Последний из них (tbk_pack1) является сложным объектом, содержащим несколько других.<br />
Таким образом, игровой проект можно представить как '''дерево''', на различных ветках которого находятся игровые объекты.<br />
<br />
== Редактор сцен ==<br />
<br />
=== Открытие проекта ===<br />
<br />
Шаг первый. <br />
Вверху окна редактора расположено общее меню и кнопки быстрого запуска:<br />
<br />
[[Файл:Меню.png]]<br />
<br />
Если нажать пункт меню <tt>Project</tt> (Проект), то выпадет список команд, с помощью которых можно [[Подготовка к работе "Создание проекта"|создать новый]] или загрузить уже созданный проект, сохранить проект с указанием места сохранения и т.д.<br />
<br />
Откроем проект, на основании которого будут проходиться эти уроки. Для этого нажмём в меню пункты <tt>Project</tt> &rarr; <tt>Open</tt> или сразу кнопку быстрого доступа [[Файл:Открыть проект.png]]. Заходим в папку '''Мои документы/Absolutist/Projects/Lessons'''.<br />
Внутри неё кликнем на файл '''lessons.seproj''' <br />
<br />
[[Файл:Seproj.JPG|400px]].<br />
<br />
В результате откроется проект, визуальная часть которого окажется в основной (центральной) части редактора. Чтобы увидеть что-то кроме белого экрана, необходимо на панели Layout, которая находится в правой верхней части экрана, кликнуть мышкой на строчку с надписью '''lesson_1''' (это первый игровой экран приложения). В результате мы должны увидеть:<br />
<br />
[[Файл:Экран.png|1000px]]<br />
<br />
=== Свойства проекта ===<br />
<br />
В правой части окна редактора расположены две панели '''Layout''' (лейаут) и '''Properties''' (свойства).<br />
На панели Layout показано иерархическое дерево проекта, который пока состоит из одного игрового экрана lesson_1. Если кликнуть на стрелочку (или плюсик, или треугольник, в зависимости от Вашей ОС) слева от надписи lesson_1, то экран раскроется и мы увидим [[Проектирование_экранов_игры#Принципы_формирования_сцен_и_их_наполнения|сцену]], которая находится на [[Проектирование_экранов_игры|экране]]. Она называется lessons_1. Продолжая кликать на стрелочки, раскроем всю структуру этого проекта: <br />
<br />
[[Файл:Лэйаут.png]]<br />
<br />
Наиболее простым объектом, находящимся в дереве проекта, является статическая картинка фона, которая называется '''bg'''. Если на неё кликнуть, то ниже в панели '''Properties''' можно увидеть параметры настройки этого объекта (его свойства):<br />
<br />
[[Файл:Свойства.png]]<br />
<br />
Стоит "пораскрывать" ветки настроек объекта bg, нажимая на стрелочки (или плюсики, или треугольники) слева от имен полей. Если навести мышкой на имя поля, то появится краткая подсказка, поясняющий смысл свойства.<br />
<br />
Панели Layout и Properties могут перетаскиваться мышкой в произвольное место редактора,<br />
располагаться одна под другой или объединяться в одну панель с двумя закладками снизу.<br />
Если панели находятся одна под другой, можно мышкой изменить их относительную высоту. Для этого мышь располагаем между ними, пока она не изменит своей формы со стрелочки на сплиттер (две горизонтальные полоски). Затем, нажав на мышь, таскаем вверх-вниз границу между панелями.<br />
<br />
=== Проигрывание проекта ===<br />
<br />
В процессе разработки игрового проекта, игру в любой момент можно запустить в отдельном окне вьювера ('''Viewer''') для проверки. Для этого в дереве проекта (панель Layout) необходимо выбрать интересующий нас экран (с которого произойдёт запуск) и нажать кнопку [[Файл:Play111.png]] (или пункт меню <tt>Viewer</tt> &rarr; <tt>Start Viewer</tt>).<br />
<br />
<br />
[[файл:View.png]]<br />
<br />
<br />
В нашем случае мы увидим летающее над слонёнком солнышко. Оба объекта (и слонёнок, и солнышко) являются активными. Кликните сначала на голову слонёнка - она должна повернуться. Клик на тело слонёнка заставит его подпрыгнуть. При должной сноровке можно кликнуть также на летающее солнышко, что приведёт к кратковременному изменению его формы.<br />
<br />
Стоит запомнить три важных правила при работе с вьювером:<br />
* Если приложение редактировалось, то перед запуском вьювера проект необходимо <u>сначала</u> сохранить (меню: <tt>Project</tt> &rarr; <tt>Save Project</tt>).<br />
* Всегда необходимо перед запуском вьювера выбирать экран, который начнёт проигрываться (сейчас такой экран пока один).<br />
* После просмотра во вьювере игры, его необходимо закрыть, нажав (как обычно в Windows) крестик в правом верхнем углу окна.<br />
<br />
=== Кнопки быстрого запуска ===<br />
<br />
Приведем для справки описание кнопок быстрого доступа к некоторым командам редактора сцен (более подробная информация будет предоставлена в последующих уроках):<br />
<br />
*[[Файл:00001.png]] — создать новый проект; <br />
*[[Файл:Открыть проект.png]] — открыть уже созданный проект;<br />
*[[Файл:00002.png]] — сохранить изменения в проекте; <br />
*[[Файл:00003.png]] — нормальный вид; <br />
*[[Файл:Play111.png]] — запустить Viewer;<br />
*[[Файл:000004.png]] — запустить Viewer с изменением времени; <br />
*[[Файл:000005.png]] — очистить данные;<br />
*[[Файл:00006.png]] — вызов редактора ресурсов;<br />
*[[Файл:00007.png]] — вызов текстового редактора;<br />
*[[Файл:00008.png]] — анализ использованных ресурсов; <br />
*[[Файл:00009.png]] — поиск объекта по имени или id;<br />
*[[Файл:0000010.png]] — общие свойства объекта.<br />
<br />
<br />
== [[Редактор ресурсов]] ==<br />
<br />
Второе важное приложение, это редактор ресурсов.<br />
Так как мы открыли готовый проект, то с ним уже связана база графических ресурсов.<br />
Чтобы её увидеть, нажмите кнопку [[Файл:00006.png|20px]] (или меню: <tt>Tools</tt> &rarr; <tt>Resources Editor</tt>).<br />
Откроется новое окно, которое, на самом деле, является независимым приложением:<br />
<br />
[[Файл:Редактор ресурсов111.png]]<br />
<br />
Как и в редакторе сцен, вверху окна редактора ресурсов расположено меню и кнопки быстрого доступа: создать базу ресурсов, открыть уже существующую, показать экспорт последних объектов, сохранить изменения в редакторе ресурсов, добавить картинку (png, jpeg), добавить картинку из папки, добавить анимацию, мелодию (mp3, ogg), видео (mp4).<br />
Ниже, в левой панели, находятся папки, внутри которых можно найти различные графические ресурсы, которые мы будем использовать на протяжении этих уроков. Каждая папка названа по имени урока.<br />
Кликнув на стрелочку (или плюсик, или треугольник) слева от папки lesson_1 мы увидим текстовый список из 8 картинок, находящихся в ранее запущенном приложении со слоненком и солнышком.<br />
<br />
Если в дереве папок активна данная папка, то на правой панели мы видим список графических ресурсов в виде иконок. Если же в дереве кликнуть на имя конкретной картинки, то в правой панели она будет представлена в натуральную величину. Если кликнуть правой кнопкой мыши на конкретный ресурс отобразится всплывающее подменю, которое аналогично кнопкам быстрого доступа, за исключением одного пункта - <tt>Заменить изображение...</tt>. Замену изображений необходимо делать через всплывающее подменю.<br />
<br />
Текущее приложение содержит фоновую картинку (bg), три картинки частей слонёнка (elephant_body, elephant_head_1, elephant_head_2) и 4 картинки с различным видом солнышка. <br />
<br />
Так как редактор ресурсов является отдельным приложением, он может оказаться под окном редактора сцен. Это не всегда удобно, поэтому зайдем в пункт меню <tt>'''View'''</tt> редактора ресурсов и поставим галочку у пункта <tt>'''Always on Top'''</tt>. Теперь редактор ресурсов окажется поверх редактора сцен (как впрочем, и поверх всех остальных окон). Естественно, галочку можно в любой момент снять или свернуть окно редактора ресурсов.<br />
<br />
Размер окна редактора ресурсов можно изменять мышкой, схватившись за правый нижний угол окна.<br />
Правую панель, которая выводит картинки, можно “перетащить” в любое место окна редактора ресурсов (для этого необходимо потянуть за её заголовок). Чтобы вернуть панель на фиксированное место, необходимо дважды кликнуть на её заголовке.<br />
<br />
<br />
== Редактирование сцены ==<br />
<br />
=== Добавление на сцену ===<br />
<br />
Разберемся, как на сцену добавляются новые объекты. Предполагается, что мы одновременно видим окна обоих редакторов. Убедимся, что в панели проекта (Layout) редактора сцен активна текущая сцена lessons_1. Не путайте её с экраном lesson_1, находящимся выше. Рядом с каждым объектом в дереве ресурсов находится иконка, отражающая тип объекта. Рядом с экраном изображено, что-то похожее на фотоаппарат, а рядом со сценой - чистый лист бумаги. <br />
<br />
Нажав мышкой на иконку головы слонёнка в '''редакторе ресурсов''', перетащим её на сцену в '''редактор сцен''', где кнопку мышки отпустим:<br />
<br />
<br />
[[Файл:Add picture.png|800px]]<br />
<br />
Теперь окно редактора ресурсов можно свернуть, чтобы оно не мешало. <br />
На сцене мы видим одного полноценного слонёнка и отдельно парящую голову.<br />
В списке объектов (панель Layout) добавился объект elephant_head_2. <br />
Его имя по умолчанию совпадает с именем картинки в редакторе ресурсов.<br />
Если оно не достаточно точно выражает назначение этого объекта, то его '''необходимо'''<br />
изменить в панели Properties (предполагается, что на дереве объектов эта голова сейчас выбрана).<br />
Переименуем её, например, в elephant_ghost (дух слонёнка). Для этого кликнем справа от поля '''имя''' в панели Properties и введем новое название. После окончания редактирования нажимаем Enter. Одновременно с этим изменилось имя на дереве объектов (Layout).<br />
Стоит всегда придерживаться следующего правила:<br />
<br />
<blockquote><br />
[[файл:Ok.png|right|32px]]<br />
'''Необходимо присваивать объектам в проекте осмысленные имена, отражающие их роль и функции. Это относится также к именам экранов и сцен.'''<br />
</blockquote><br />
<br />
Названия объектов могут повторяться, но это плохой тон. В частности, неудачным примером названий в этом проекте служат похожие имена экрана (lesson_1) и сцены (lessons_1). Плохое имя (move) у летающего солнышка (лучше было бы fly_sun). <br />
<br />
Обратим внимание, что добавленная голова имеет тип '''image''' (первое поле в панели Properties).<br />
Большинство объектов в начале имеют такой тип. Далее он меняется в зависимости от функциональности объекта (подробнее об этом в следующих уроках).<br />
<br />
<blockquote><br />
[[файл:Ok.png|right|32px]]<br />
'''Совет''': Переименовывать объекты можно непосредственно в панели Layout, после двойного клика мышкой на имя этого объекта. Редактирование завершается нажатием клавиши Enter. <br />
</blockquote><br />
<br />
=== Изменение положения ===<br />
<br />
На сцене вокруг добавленной головы находится <span style="color:#007700">зелёная прямоугольная рамка</span> (объект активен). <br />
Если она <span style="color:#770000">красная</span>, необходимо кликнуть на объект (голову) и он станет активным.<br />
Заметим, что при клике на объекте меняется не только цвет рамки, <br />
но и активный объект на дереве объектов (Layout). Соответственно в панели Properties показываются его свойства.<br />
Стоит покликать на различные объекты на сцене и на дереве проекта, наблюдая одним глазом за их рамкой, а другим за панелями проекта и свойств. В заключение этого увлекательного упражнения необходимо снова сделать активной голову.<br />
<br />
Активный объект можно таскать мышкой по экрану, задав ему требуемое положение (не оторвите только голову исходному слоненку). Стоит раскрыть свойство "'''положение'''" в панели Properties и понаблюдать, как при таскании головы меняются её координаты. <br />
Начало координат (точка x=0, y=0) расположено в центре сцены. Горизонтальная ось x направлена вправо, а вертикальная ось y - вниз. Если объект находится ниже центра сцены, он будет иметь положительное значение y, а если выше, то отрицательное.<br />
Естественно, положение объекта можно изменить и при помощи прямого редактирования полей '''x''', '''y''' свойства "'''положение'''". Перетащите голову в правый верхний угол сцены.<br />
<br />
<br />
=== Модификаторы ===<br />
<br />
Будем считать, что добавленная голова слона - это дух предков исходного слонёнка.<br />
Духу положено быть полупрозрачным. Это достигается изменением <br />
свойства '''alpha''' в группе '''модификаторы''' на панели свойств (Properties).<br />
Изменим исходное значение 1.00 (непрозрачен) на 0.5 (полупрозрачен).<br />
Значение alpha=0 соответствует полной невидимости объекта (возможно любое значение между 0 и 1).<br />
Обратим внимание, что десятичная точка является именно точкой, а не запятой, как всё ещё учат на 1/6 части суши. Впрочем, если в вашей операционной системе в языковых настройках стоит русский язык, Вы увидите привычную запятую, вместо десятичной точки. <br />
<br />
Дополнительно в разделе '''модификаторы''' можно изменить угол ('''angle''') в градусах (поставьте, например -30)<br />
и масштаб картинки (поля '''scale x''' и '''scale y'''). Исходная картинка имеет единичный масштаб, т.е. на сцене выглядит также, как и в редакторе ресурсов. Если масштаб увеличить, то увеличится и картинка (это можно сделать независимо по ширине и высоте). <br />
Соответственно, значение меньшее 1 (но большее нуля) её уменьшит.<br />
Отрицательное значение масштаба переворачивает картинку. Задайте scale_x=-2 и scale_y=2.<br />
В результате должно получиться что-то типа:<br />
<br />
<br />
[[Файл:Mod.png|800px]]<br />
<br />
Заметим, что при сильном масштабировании (scale) могут появляться дефекты картинки (квадратики пикселей), поэтому злоупотреблять большими значениями, обычно, не стоит.<br />
<br />
=== Z - порядок объектов ===<br />
<br />
Пришло время посмотреть, что у нас получилось. Для этого сохраняем все изменения <br />
[[Файл:00 8.png]] (нажав кнопку Ok на выскочившем окошке).<br />
Затем запускаем вьювер [[Файл:00 9.png]]. Понаблюдаем за солнцем. Оно движется над фоновой<br />
картинкой "'''bg'''", но ''под'' головой духа слона (он должен, естественно, находится в верхней части сцены). Такая последовательность прорисовки связана с порядком объектов в дереве на панели Layout. Отрисовка происходит сверху вниз (сначала bg, затем move и т.д.). Это правило является иерархическим. Если на дереве находятся объекты, содержащие другие объекты, то сначала рисуется вся эта ветка дерева, а затем поверх неё рисуются нижележащие на дереве объекты на других ветках. Это же правило относится к последовательности рисования сцен. Если на экране несколько сцен, то они рисуются сверху вниз в соответствии с их порядком на дереве. Сама по себе сцена - это невидимый объект (контейнер). Поэтому, рисование сцены означает последовательное рисование всех объектов, которые в ней находятся.<br />
<br />
Попробуем во вьювере кликнуть на солнце, когда оно оказывается под головой духа слона.<br />
Его форма не изменяется, так как картинка головы, хотя и является полупрозрачной, по умолчанию "не прокликивается". Чтобы изменить ситуацию, закроем вьювер (крестик) и отредактируем поле свойств головы с именем "'''прокликиваемая'''", выбрав из соответствующего списка "прокликиваемая" вместо "нет". Закончив редактирование поля (нажав Enter), сохраняем проект [[Файл:00 8.png]] и снова запускаем вьювер [[Файл:00 9.png]].<br />
Теперь дух, как и положено астральным образованиям, пропускает клик сквозь себя.<br />
<br />
Порядок рисования объектов можно изменить, перетащив их по дереву в панели Layout.<br />
Эта операция требует определенной сноровки. Наступим на имя объекта elephant_ghost и не отпуская мыши потащим его вверх. Когда он окажется на уровне объекта bg, отпустим мышь. Он станет подобъектом фона,<br />
что отобразится как сдвиг elephant_ghost вправо (у объекта фона bg слева появится стрелочка). Теперь снова схватим elephant_ghost и потащим чуть вниз и влево по дереву.<br />
Когда указатель мыши окажется между объектами bg и move, появится длинная горизонтальная полоска. В этот момент отпускаем мышь, и наш дух размещается между этими объектами.<br />
<br />
Ниже на рисунке представлены оба варианта положения духа на дереве сцены (слева подобъект elephant_ghost в объекте bg, а справа равноправный с bg объект, но ниже по дереву и, следовательно, рисуемый позже):<br />
<br />
<br />
[[файл:El.png]]<br />
[[файл:El2.png]]<br />
<br />
С точки зрения отрисовки, оба эти варианта приведут к одинаковому результату.<br />
Проверьте это, потренировавшись в таскании, сохранении и запуске вьювера. Подумайте также, почему так происходит.<br />
<br />
=== Удаление объектов ===<br />
<br />
Откройте снова окно редактора ресурсов (скорее всего оно находится в свернутом состоянии в панели приложений). Расположите его над окном редактора сцен. Перетащите на сцену из папки lesson_1 какую-нибудь небольшую картинку (например, sun_1). Сверните редактор ресурсов. Новая картинка появилась на сцене и в дереве объектов панели Layout. Чтобы её удалить, нажмите правую кнопку мыши на объекте sun_1 в панели Layout. В вывалившемся меню выберете пункт '''Delete'''. Картинка исчезнет. Эквивалентно, объект можно удалить, кликнув на него в дереве и нажав на клавиатуре кнопку Del.<br />
<br />
Заметим, что если объект на сцене сделать активным (кликнув на него - зеленая рамка) и попытаться нажать Del, то ничего не произойдет. Сделано это умышленно. Дело в том, что при удалении уничтожается не только сам объект, но и все его подобъекты. Подобная иерархия видна только на дереве проекта. <br />
<br />
В качестве упражнения, поместите на сцену две картинки. Одну из них в дереве панели Layout перетащите на другую, сделав её подобъектом. Потаскайте мышкой по сцене обе картинки. Обратите внимание, что подобъект перемещается независимым образом. В тоже время при таскании корневого объекта начнут двигаться они оба. Координаты подобъекта задаются относительно его владельца. Поэтому при перемещении корневого объекта вместе с ним движутся и все подобъекты.<br />
Теперь удалите сразу оба объекта, сделав активным на дереве корневой объект и нажав затем на кнопку Del (или при помощи правой кнопки мыши).<br />
<br />
<br />
=== Другие объекты ===<br />
<br />
На нашей сцене кроме картинок находятся еще два типа объектов - это кнопка и машина состояний. С кнопками мы будем работать уже на следующем [[Создание экранов, сцен. Работа с кнопками|уроке]], а машинам состояний посвящены сразу 3 урока, начиная с [[Checkbox как машина состояний|третьего]]. Пока наша задача состоит в их поиске в дереве проекта и первым знакомством с их свойствами.<br />
<br />
Кликнем на стрелочку слева от объекта move в панели Layout. Под ним раскроется подобъект с именем '''sun_1'''. Это кнопка. Сам же объект move является машиной состояния. Кроме указания соответствующего типа в панели Properties (посмотрите на него!), тип объекта помечается иконкой на дереве. Для машины - это шестеренка, а кнопка - это кнопка :).<br />
<br />
Кликнув на объект '''sun_1''', рассмотрим его свойства в панели Properties. Кроме уже знакомых по картинке (тип=image) полей, появился ряд других. Например, раскроем стрелочку свойства "'''внешний вид'''". Там находятся несколько полей, из которых заполнены '''up''' и '''down'''. В них заданы имена картинок для изображения отжатой и нажатой кнопки. Как они там оказались выясним в следующем [[Создание экранов, сцен. Работа с кнопками|уроке]]. <br />
<br />
Рассмотрим теперь объект '''move'''. Не смотря на небольшое количество свойств, это один из самых универсальных и сложных объектов, позволяющих программировать динамическое поведение объектов и их логику. Чтобы краем глаза заглянуть на кухню этого процесса кликните на свойство '''states''', а затем на появившиеся три точки в этом поле. Выскочит следующее окошко:<br />
<br />
<br />
[[файл:Mov prop.png]] [[файл:Move.png]]<br />
<br />
Эта машина состояний, которая имеет одно состояние. В нём задана последовательность команд, которые управляют её движением по экрану. Сама машина в данном случае является невидимым объектом. Однако, она содержит в качестве подобъекта кнопку '''sun_1'''. Поэтому, когда машина move бегает по экрану, вместе с ней движется и кнопка. Клики на себя принимает кнопка, меняя при этом свой внешний вид. Несложно догадаться, что в результате получается солнышко.<br />
<br />
<br />
== Упражнения ==<br />
<br />
* Найдите две машины состояний, связанные со слонёнком, и попробуйте догадаться как они работают (ответы в следующих уроках).<br />
* Откройте демонстрационный проект, находящийся в папке AppSaluteСreator/Projects/Demo/demо. Поиграйтесь с ним.<br />
* Снова откройте учебный проект c которым мы работали (AppSaluteСreator/Projects/Lessons/lessons). Он нам понадобится для следующего урока.<br />
* Затем переходите на [[Создание экранов, сцен. Работа с кнопками|урок 2]].<br />
<br />
<br />
----<br />
{| width="100%" <br />
| width="40%"|[[Learning|Оглавление]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Создание экранов, сцен. Работа с кнопками|Урок 2]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A0%D0%B0%D0%B1%D0%BE%D1%82%D0%B0_%D1%81_%D1%8D%D1%84%D1%84%D0%B5%D0%BA%D1%82%D0%B0%D0%BC%D0%B8&diff=9817Работа с эффектами2019-07-29T06:10:53Z<p>Apolozova: </p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Настройка миниигр|Урок 8]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Экспорт, импорт и релиз проекта|Урок 10]]<br />
|}<br />
----<br />
{{TOC right}}<br />
<br />
'''Цель:''' изучить возможности редактора на примере применения различных эффектов.<br />
<br />
'''Задачи:'''<br />
* Создать экран, на котором можно освоить работу с патиклами (объект flyer) и масками ;<br />
* Создать экран и настроить просмотр Видео<br />
* Настроить появление сцены с проявлением по альфе, переходить на следующий экран с проявлением по альфе<br />
* Настроить фоновую музыку.<br />
<br />
== Партиклы (Particles) ==<br />
<br />
'''Создание экрана и сцены в игровом проекте'''<br />
<br />
1. Запустить SceneEditor.<br />
<br />
2. В меню Проект → Загрузить → lessons.seproj. <br />
<br />
3. Кликнув правой кнопкой мыши по ранее созданному экрану Lesson_08.3, создать экран Lesson_09.<br />
<br />
4. В экране Lesson_09 создать новую сцену 09, в которую (через Resources Editor) добавить графические ресурсы из папки Sources\Lesson_09 (см. подготовка к работе «Создание проекта»).<br />
<br />
[[Файл:Lesson9_1.jpg|350px]]<br />
<br />
'''Настройка объектов, работа с маской'''<br />
<br />
В этом уроке поработаем над использованием объекта flyer (Particles). Параллельно с этим научимся пользоваться хитрым приемом "маска". В редактор ресурсов вы подгрузили уже знакомую вам графику "лунного пейзажа" и две части слоненка. <br />
<br />
1. Разместим их на сцене как показано на рисунке.<br />
<br />
[[Файл:Lesson9_2.jpg|350px]]<br />
<br />
2. Сделаем из головы слоненка машину состояний. Голова должна вертеться из стороны в сторону с интервалом в 1 секунду. Запишем в состояниях машины следующие параметры.<br />
<br />
[[Файл:Lesson9_3.jpg|350px]]<br />
<br />
3. Посмотрите результат с помощью программы viewer. Слоненок будет мотать головой.<br />
<br />
4. Теперь мы хотим, чтобы клик на слоненка вызывал какое-то действие, например, чтобы шел снег. Можно сделать из туловища машину состояний, но туловище маленькое, а нам нужен именно весь слоненок. Для этого нам понадобится маска. Из редактора ресурсов перетащим на сцену графический ресурс mask и переместим ее на слоненка. Маска очень маленькая, чтобы закрывать всего слоненка, поэтому воспользуемся модификаторами. Увеличим маску и сделаем ей прозрачность (alpha) 0,01.<br />
<br />
[[Файл:Lesson9_4.jpg|350px]]<br />
<br />
На сцене вы можете увидеть вокруг слоненка рамку от маски. Саму маску не видно из-за прозрачности. Стоит обратить внимание на то, что прозрачность мы сделали 0,01. Если бы она была равна 0, то маска не воспринимала бы клик, а была бы полностью прозрачной.<br />
<br />
5. Как вы уже догадались, маска у нас будет машиной состояний, включающей другой объект. Этим другим объектом будет flyer. Флаеры (патиклы) используются для создания эффектов, когда один маленький объект размножается и совершает какие-либо действия, при этом все его частички ведут себя подобно.<br />
<br />
Перетащим из редактора ресурсов на сцену графический ресурс snow и разместим его на сцене посередине по оси x (x=0) и вверху, немного за сценой (y=-320). Сделайте объекту тип flyer.<br />
<br />
6. Параметры флаера настроим немного позже, а сейчас вернемся к нашей маске. Сделайте маске тип machine. И введите следующие параметры.<br />
<br />
[[Файл:Lesson9_5.jpg|350px]]<br />
<br />
В первом состоянии (начальном) машина передает объекту snow состояние end, а во втором - beg. У флаера есть два состояния end и beg, в которых он выключен и включен соответственно. Чтобы без нашего желания флаер не запускался, в свойствах snow в поле "состояние" запишем его начальное состояние end.<br />
<br />
[[Файл:Lesson9_6.jpg]]<br />
<br />
Подробно о свойствах флаера можно почитать [[Flyer|тут]]. Для того чтобы из него получился снег запишите следующие свойства.<br />
<br />
[[Файл:Lesson9_7.jpg]]<br />
<br />
7. Сохраните проект и проверьте его выполнение в программе viewer. При клике на слоненка начинает идти снег, а при повторном клике снег исчезает.<br />
<br />
8. Следующей нашей задачей будет создание разлетающегося кольца из звездочек вокруг желтой звезды на сцене, при клике на эту звезду. Представьте, что эта сцена у вас сейчас на экране мобильного телефона, а вам нужно дотронуться до звезды. Звезда очень маленькая, как следствие - по ней трудно попасть. Здесь нам на помощь опять явится маска. Снова перетащите ресурс mask на сцену из редактора ресурсов, переименуйте его в star_mask и поместите точно над звездой.<br />
<br />
9. Растягивать маску не нужно, она таких размеров, как нам нужно. В свойствах star_mask в модификаторах задайте alpha=0,01.<br />
<br />
10. Добавьте на сцену ресурс star из редактора ресурсов и поместите его точно на звезду.<br />
<br />
[[Файл:Lesson9_8.jpg]]<br />
<br />
11. Объекту star_mask нужно изменить тип на machine, а объекту star на flyer.<br />
<br />
[[Файл:Lesson9_9.jpg]]<br />
<br />
12. Задайте машине star_mask следующие состояния.<br />
<br />
[[Файл:Lesson9_10.jpg]]<br />
<br />
13. Флаеру star пропишите следующие свойства.<br />
<br />
[[Файл:Lesson9_11.jpg]]<br />
<br />
14. Сохраните проект и проверьте его выполнение в программе viewer. При клике на звезду флаер будет вести себя как взрыв сверхновой (или салют).<br />
<br />
=== Упражнения ===<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_09, создать новый экран Lesson_09.1<br />
<br />
2. Создать новую сцену с названием .<br />
<br />
3. Скопировать все объекты из сцены 09 (экрана Lesson_09).<br />
<br />
4. Вставить скопированые объекты в новую сцену (экрана Lesson_09.1).<br />
<br />
5. В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) снег шел при клике на любую область экрана;<br />
b) изменить параметры флаера snow таким образом, чтобы он выглядел как дождь;<br />
с) поиграйтесь с параметрами флаера, чтобы прочувствовать зависимость поведения флаера от его параметров.<br />
<br />
<br />
== Использование Видео ==<br />
<br />
'''Создание экрана и сцены в игровом проекте'''<br />
<br />
1. Создайте еще один экран Lesson_9.2 после экрана Lesson_9.1.<br />
<br />
2. Добавьте сцену 09.<br />
<br />
3. Загрузите на сцену ресурсы к этому уроку из редактора ресурсов (bg, play).<br />
<br />
<br />
'''Настройка объектов, работа с видео'''<br />
<br />
1. Создайте на сцене новый объект и сделайте ему тип video. Переименуйте его в video.<br />
<br />
[[Файл:Lesson9_12.jpg|350px]]<br />
<br />
2. Из ресурса play сделайте машину состояний. Пропишите машине следующие состояния.<br />
<br />
[[Файл:Lesson9_13.jpg]]<br />
<br />
3. Объекту video выставляем следующие параметры. <br />
<br />
[[Файл:Lesson9_14.jpg]]<br />
<br />
Обратите внимание, что id видео перетаскивается мышкой из редактора ресурсов.<br />
<br />
4. Сохраните проект и посмотрите результат в программе viewer.<br />
<br />
== Звуки ==<br />
<br />
Для того, чтобы игра была веселее и живее в редакторе предусмотрена возможность использовать звуки. В этом уроке мы научимся ставить фоновую музыку.<br />
<br />
1. Вернитесь к экрану Lesson_09.<br />
<br />
2. Создайте на сцене 09 новый объект и назовите его music.<br />
<br />
[[Файл:Lesson9_12.jpg]]<br />
<br />
3. Сделайте из объекта music машину состояний и пропишите следующие состояния.<br />
<br />
[[Файл:Lesson9_15.jpg]]<br />
<br />
Согласно этих состояний, сразу после запуска экрана начинает играть музыка music_gaming_04. Через 60 секунд после начала машина идет в состояние stop, где дается команда mus_stop и проигрывание музыки останавливается. Музыку можно не останавливать, тогда она будет играть по кругу.<br />
<br />
<br />
=== Упражнения ===<br />
<br />
В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) после остановки проигрывания музыки можно кликом на слоненка снова ее запустить;<br />
<br />
b) чтобы музыка останавливалась кликом на слоненка.<br />
<br />
----<br />
{| width="100%" <br />
| width="40%"|[[Настройка миниигр|Урок 8]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Экспорт, импорт и релиз проекта|Урок 10]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozovahttps://wiki.appsalutecreator.com/index.php?title=%D0%A0%D0%B0%D0%B1%D0%BE%D1%82%D0%B0_%D1%81_%D1%8D%D1%84%D1%84%D0%B5%D0%BA%D1%82%D0%B0%D0%BC%D0%B8&diff=9816Работа с эффектами2019-07-29T06:09:23Z<p>Apolozova: </p>
<hr />
<div>{| width="100%" <br />
| width="40%"|[[Настройка миниигр|Урок 8]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Экспорт, импорт и релиз проекта|Урок 10]]<br />
|}<br />
----<br />
{{TOC right}}<br />
<br />
'''Цель:''' изучить возможности редактора на примере применения различных эффектов.<br />
<br />
'''Задачи:'''<br />
* Создать экран, на котором можно освоить работу с патиклами (объект flyer) и масками ;<br />
* Создать экран и настроить просмотр Видео<br />
* Настроить появление сцены с проявлением по альфе, переходить на следующий экран с проявлением по альфе<br />
* Настроить фоновую музыку.<br />
<br />
== Партиклы (Particles) ==<br />
<br />
'''Создание экрана и сцены в игровом проекте'''<br />
<br />
1. Запустить SceneEditor.<br />
<br />
2. В меню Проект → Загрузить → lessons.seproj. <br />
<br />
3. Кликнув правой кнопкой мыши по ранее созданному экрану Lesson_08.3, создать экран Lesson_09.<br />
<br />
4. В экране Lesson_09 создать новую сцены 09 , в которую (через Resources Editor) добавить графические ресурсы из папки Sources\Lesson_09 (см. подготовка к работе «Создание проекта»).<br />
<br />
[[Файл:Lesson9_1.jpg|350px]]<br />
<br />
'''Настройка объектов, работа с маской'''<br />
<br />
В этом уроке поработаем над использованием объекта flyer (Particles). Параллельно с этим научимся пользоваться хитрым приемом "маска". В редактор ресурсов вы подгрузили уже знакомую вам графику "лунного пейзажа" и две части слоненка. <br />
<br />
1. Разместим их на сцене как показано на рисунке.<br />
<br />
[[Файл:Lesson9_2.jpg|350px]]<br />
<br />
2. Сделаем из головы слоненка машину состояний. Голова должна вертеться из стороны в сторону с интервалом в 1 секунду. Запишем в состояниях машины следующие параметры.<br />
<br />
[[Файл:Lesson9_3.jpg|350px]]<br />
<br />
3. Посмотрите результат с помощью программы viewer. Слоненок будет мотать головой.<br />
<br />
4. Теперь мы хотим, чтобы клик на слоненка вызывал какое-то действие, например, чтобы шел снег. Можно сделать из туловища машину состояний, но туловище маленькое, а нам нужен именно весь слоненок. Для этого нам понадобится маска. Из редактора ресурсов перетащим на сцену графический ресурс mask и переместим ее на слоненка. Маска очень маленькая, чтобы закрывать всего слоненка, поэтому воспользуемся модификаторами. Увеличим маску и сделаем ей прозрачность (alpha) 0,01.<br />
<br />
[[Файл:Lesson9_4.jpg|350px]]<br />
<br />
На сцене вы можете увидеть вокруг слоненка рамку от маски. Саму маску не видно из-за прозрачности. Стоит обратить внимание на то, что прозрачность мы сделали 0,01. Если бы она была равна 0, то маска не воспринимала бы клик, а была бы полностью прозрачной.<br />
<br />
5. Как вы уже догадались, маска у нас будет машиной состояний, включающей другой объект. Этим другим объектом будет flyer. Флаеры (патиклы) используются для создания эффектов, когда один маленький объект размножается и совершает какие-либо действия, при этом все его частички ведут себя подобно.<br />
<br />
Перетащим из редактора ресурсов на сцену графический ресурс snow и разместим его на сцене посередине по оси x (x=0) и вверху, немного за сценой (y=-320). Сделайте объекту тип flyer.<br />
<br />
6. Параметры флаера настроим немного позже, а сейчас вернемся к нашей маске. Сделайте маске тип machine. И введите следующие параметры.<br />
<br />
[[Файл:Lesson9_5.jpg|350px]]<br />
<br />
В первом состоянии (начальном) машина передает объекту snow состояние end, а во втором - beg. У флаера есть два состояния end и beg, в которых он выключен и включен соответственно. Чтобы без нашего желания флаер не запускался, в свойствах snow в поле "состояние" запишем его начальное состояние end.<br />
<br />
[[Файл:Lesson9_6.jpg]]<br />
<br />
Подробно о свойствах флаера можно почитать [[Flyer|тут]]. Для того чтобы из него получился снег запишите следующие свойства.<br />
<br />
[[Файл:Lesson9_7.jpg]]<br />
<br />
7. Сохраните проект и проверьте его выполнение в программе viewer. При клике на слоненка начинает идти снег, а при повторном клике снег исчезает.<br />
<br />
8. Следующей нашей задачей будет создание разлетающегося кольца из звездочек вокруг желтой звезды на сцене, при клике на эту звезду. Представьте, что эта сцена у вас сейчас на экране мобильного телефона, а вам нужно дотронуться до звезды. Звезда очень маленькая, как следствие - по ней трудно попасть. Здесь нам на помощь опять явится маска. Снова перетащите ресурс mask на сцену из редактора ресурсов, переименуйте его в star_mask и поместите точно над звездой.<br />
<br />
9. Растягивать маску не нужно, она таких размеров, как нам нужно. В свойствах star_mask в модификаторах задайте alpha=0,01.<br />
<br />
10. Добавьте на сцену ресурс star из редактора ресурсов и поместите его точно на звезду.<br />
<br />
[[Файл:Lesson9_8.jpg]]<br />
<br />
11. Объекту star_mask нужно изменить тип на machine, а объекту star на flyer.<br />
<br />
[[Файл:Lesson9_9.jpg]]<br />
<br />
12. Задайте машине star_mask следующие состояния.<br />
<br />
[[Файл:Lesson9_10.jpg]]<br />
<br />
13. Флаеру star пропишите следующие свойства.<br />
<br />
[[Файл:Lesson9_11.jpg]]<br />
<br />
14. Сохраните проект и проверьте его выполнение в программе viewer. При клике на звезду флаер будет вести себя как взрыв сверхновой (или салют).<br />
<br />
=== Упражнения ===<br />
<br />
1. Щелкнув правой кнопкой мыши по экрану Lesson_09, создать новый экран Lesson_09.1<br />
<br />
2. Создать новую сцену с названием .<br />
<br />
3. Скопировать все объекты из сцены 09 (экрана Lesson_09).<br />
<br />
4. Вставить скопированые объекты в новую сцену (экрана Lesson_09.1).<br />
<br />
5. В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) снег шел при клике на любую область экрана;<br />
b) изменить параметры флаера snow таким образом, чтобы он выглядел как дождь;<br />
с) поиграйтесь с параметрами флаера, чтобы прочувствовать зависимость поведения флаера от его параметров.<br />
<br />
<br />
== Использование Видео ==<br />
<br />
'''Создание экрана и сцены в игровом проекте'''<br />
<br />
1. Создайте еще один экран Lesson_9.2 после экрана Lesson_9.1.<br />
<br />
2. Добавьте сцену 09.<br />
<br />
3. Загрузите на сцену ресурсы к этому уроку из редактора ресурсов (bg, play).<br />
<br />
<br />
'''Настройка объектов, работа с видео'''<br />
<br />
1. Создайте на сцене новый объект и сделайте ему тип video. Переименуйте его в video.<br />
<br />
[[Файл:Lesson9_12.jpg|350px]]<br />
<br />
2. Из ресурса play сделайте машину состояний. Пропишите машине следующие состояния.<br />
<br />
[[Файл:Lesson9_13.jpg]]<br />
<br />
3. Объекту video выставляем следующие параметры. <br />
<br />
[[Файл:Lesson9_14.jpg]]<br />
<br />
Обратите внимание, что id видео перетаскивается мышкой из редактора ресурсов.<br />
<br />
4. Сохраните проект и посмотрите результат в программе viewer.<br />
<br />
== Звуки ==<br />
<br />
Для того, чтобы игра была веселее и живее в редакторе предусмотрена возможность использовать звуки. В этом уроке мы научимся ставить фоновую музыку.<br />
<br />
1. Вернитесь к экрану Lesson_09.<br />
<br />
2. Создайте на сцене 09 новый объект и назовите его music.<br />
<br />
[[Файл:Lesson9_12.jpg]]<br />
<br />
3. Сделайте из объекта music машину состояний и пропишите следующие состояния.<br />
<br />
[[Файл:Lesson9_15.jpg]]<br />
<br />
Согласно этих состояний, сразу после запуска экрана начинает играть музыка music_gaming_04. Через 60 секунд после начала машина идет в состояние stop, где дается команда mus_stop и проигрывание музыки останавливается. Музыку можно не останавливать, тогда она будет играть по кругу.<br />
<br />
<br />
=== Упражнения ===<br />
<br />
В новой сцене постарайтесь сами прописать состояния и команды в измененную задачу. Сделайте так, чтобы:<br />
<br />
a) после остановки проигрывания музыки можно кликом на слоненка снова ее запустить;<br />
<br />
b) чтобы музыка останавливалась кликом на слоненка.<br />
<br />
----<br />
{| width="100%" <br />
| width="40%"|[[Настройка миниигр|Урок 8]] << <br />
! width="20%"|[[Learning|Оглавление]] <br />
| width="40%" align="right"| >> [[Экспорт, импорт и релиз проекта|Урок 10]]<br />
|}<br />
<br />
[[Category:Learning]]</div>Apolozova