Как установить cocos2d x
Cocos2d-x: Сборка проекта под Android
Установка ПО
Работать будем с проектом из предыдущей статьи. Последовательно устанавливаем и настраиваем слкедующее ПО: JDK и JRE, Android SDK и среду разработки Eclipse + ADT плагин. Установка этого инструментария описана во многих статьях, например в этой.Также нам понадобиться библиотека Android NDK, на сайте cocos2d-x, не рекомендуютиспользовать официальную версию, и отправляют всех на сайт Dmitry Moskalchuk’a. Оттуда качаем нужную нам версию (я буду использовать r5). После скачивания, распаковываем архив в любую удобную папку (например: C:\android\android-ndk-r5-crystax-1\). Для компиляции нативного кода нам необходм cygwin, версии не менее 1.7. Скачиваем setup.exe, запускаем, выбираем установку из интернета, указываем путь, сервер и т.п. 
Важно, когда доберемся до окна выбора пакетов установки, отметить галочкой пакет make(введите слово make в поле Search).
Все установлено и готово к работе, мы можем продолжать.
Настройка
Чтобы не потерять наши исходные файлы, переименуем папку нашего проекта MyCocosProject, например назовем ее MyCocosProject1(не забудьте закрыть VisualStudio). Затем отредактируем файл create-android-project.bat, он находиться в рабочем каталоге, где установлен cocos2d-x, там же где и наш проект MyCocosProject (в моем случае каталог c:\android\rep\cocos2d-1.0.1-x-0.9.1\). Открываем файл в текстовом редакторе и меняем в нижеприведенных строках пути к каталогам cygwin’а, Android SDK Tools и NDK:
set _CYGBIN=f:\cygwin\bin
set _ANDROIDTOOLS=d:\android-sdk\tools
set _NDKROOT=e:\android-ndk-r5
После изменения у меня получились строки следующего содержания:
set _CYGBIN=с:\cygwin\bin
set _ANDROIDTOOLS=c:\android\android-sdk-windows\tools
set _NDKROOT=c:\android\android-ndk-r5-crystax-1
Сохраняем файл.
В процессе написания статьи, был найден небольшой “баг”. В новом релизе(1.0.1-x-0.9.1) библиотеки cocos2d-x, разработчики решили заменить название папки resource на resources, чтобы привести к общему виду проекты для iPhone и для Android. Но, как это часто бывает, поменяв это в одном месте, забыли поменять в другом. Возможно разработчики уже исправили эту ошибку, а может и нет. Мы исправим баг самостоятельно. Заходим в папку \template\android\, ищем файл build_native.sh и в блокноте(лучше использовать не стандартный блокнот) редактируем строку:
RESOURCE_ROOT=$GAME_ROOT/Resource
заменив ее на:
RESOURCE_ROOT=$GAME_ROOT/Resources
Запускаем наш новый create-android-project.bat. В консольном окне нам предложат ввести имя java пакета (введем org.cocos2dx.myapp), и имя нашего проекта (вводим MyCocosProject).
Последнее, что нас попросят — это идентификатор версии Android. Например, для версии 2.1 требуется указать 3, а для 2.2 — 4 и так далее. Мы будем использовать версию 2.1, поэтому вводим 3.
Нажимаем Enter и ждем окончания процесса. Скрипт создает папку с именем проекта, которое мы ввели, т.е. MyCocosProject и генерирует в ней шаблонный java проект. Скопируем туда же все каталоги и файлы из сохраненной ранее папки MyCocosProject1, так же перепишем файлы ресурсов из каталога Resource в папку Resources (это следствие вышеописанного “бага”, скорее всего это временная проблема и разработчики согласуют названия папок для всевозможных платформ уже в скором времени). Теперь все готово для компиляции проекта под Android.
Сборка
Запускаем CygWin и с помощью команды cd (cd /cygdrive/c/android/rep/cocos2d-1.0.1-x-0.9.1/MyCocosProject/android), переходим в нашу папку, следом выполним файл build_native.sh (./build_native.sh).
Если все было сделано правильно, то на выходе мы получаем скомпилированные библиотеки libcocos2d.so, libcocosdenshion.so и libgame.so.
Открываем, готовый к работе, Eclipse и создаем новый Android проект (New->Project, Android project). Важно, чтобы имя проекта, совпадало с названием нашего, сгенерированного скриптом, проекта, т.е. MyCocosProject. Ставим галочку напротив Create project from existing source. В поле Location указываем путь нашего проекта (C:\android\rep\cocos2d-1.0.1-x-0.9.1\MyCocosProject\android\). Api выбираем Android 2.1. Нажимаем Finish. Проект готов. Запускаем его на эмуляторе с версией SDK 2.1. И что мы видим:
Картинка отображена вверх ногами, текст и кнопка выхода не там, где должны были бы быть. Давайте откроем файл AppDelegate.cpp и найдем следующую строчку:
// sets landscape mode
pDirector->setDeviceOrientation(kCCDeviceOrientationLandscapeLeft);
именно она и повлияла на неверное отображение. С первого взгляда, в этом коде все выглядит логично, но вероятно разработчики еще не довели до ума универсальность кода для разных платформ. В нашем случае, можно закомментировать эту строку или написать следующую конструкцию:
#if (CC_TARGET_PLATFORM == CC_PLATFORM_WIN32)
// sets landscape mode
pDirector->setDeviceOrientation(kCCDeviceOrientationLandscapeLeft);
#endif
Чтобы удачно запустить проект после изменения исходного кода, нужно сначала в Eclipse сделать очистку проекта(Project->Clean). Затем в консоле cygwin повторно выполнить build_native.sh(./build_native.sh) и уже после этого запускать проект в Eclipse. После изменений получаем следующую картину:
В итоге, мы добились того, чего и хотели. Наш проект удачно запущен на эмуляторе устройства Android.
Создание многоплатформенных игр с использованием Cocos2d-x версии 3.0 и выше
В данном руководстве вы узнаете о том, как создать простую игру с помощью Cocos2d-x 3.0 или более поздней версии в среде разработки Windows и как скомпилировать её для запуска в Windows и Android.
Что такое Cocos2d-x?
Cocos2d-x – кросс-платформенный фреймворк для игр (и других графических приложений, например, интерактивных книг), основанный на cocos2d для iOS, но вместо Objective-C использующий языки C++, JavaScript или Lua.
Одно из преимуществ этого фреймворка – возможность создания игр для разных платформ (Android, iOS, Win32, Windows Phone, Mac, Linux и другие). При этом основа программы остается той же – требуется лишь незначительная адаптация под конкретную платформу.
Консоль Cocos2d-x
Консоль cocos2d-console появилась в версии 3.0. Это командная строка, предусматривающая те же функции, что и средства управления проектами в Cocos2d-x или Cocos2d-JS — создание, выполнение, построение, отладку и т.д.
Создаём свою первую игру
1. Скачайте последнюю версию фреймворка и распакуйте архив. В данном руководстве использовалась версия 3.3rc0, а архив фреймворка был распакован на рабочий стол (C:\Users\intel-user\Desktop\cocos2d-x-3.3rc0).
Структура директории Cocos2d-x версии 3.3 RC0
2. Чтобы создать в cocos2d-x новый проект, используйте setup.py (скрипт на языке Python), который находится в папке фреймворка. Он позволит конфигурировать все переменные среды для платформ Win32 и Android. Перед выполнением setup.py вам потребуется скачать, инсталлировать и конфигурировать следующие элементы:
Расположение setup.py
3. Откройте командную строку (cmd.exe) и выполните следующие команды:
– Перейдите в папку скрипта (папку фреймворка):
– Выполните скрипт setup.py:
Примечание: чтобы выполнить команду Python из командной строки, добавьте в переменную среды path папку, куда установлен Python. Скрипт потребует пути инсталляции для Android SDK, Android NDK и ANT.
Cocos2d-console требует указания пути к папке NDK
– Путь к папке Android SDK:
Cocos2d-console требует пути к папке SDK
– Путь к папке Apache ANT:
Cocos2d-console требует пути к папке ANT
После указания всех путей снова откройте командную строку (cmd.exe). Это действие необходимо для использования команд cocos2d-console.
4. Наберите cmd.exe, чтобы выйти на командную строку (команды cocos2d-console можно вводить только здесь) и снова откройте папку фреймворка:
На следующем шаге мы создадим новый проект Cocos2d-x:
Создание проекта Cocos2d-x
Структура директории MyGame
Созданный проект содержит базовый код игры (классы), ресурсы (изображения, аудио и т.д.) и по одному проекту для каждой поддерживаемой фреймворком платформы.
Создаём Android-приложение
1. Мы будем компилировать игровую программу для нескольких архитектур, а фреймворк не компилирует по умолчанию для x86 и armeabi-v7a. Отредактируйте файл Application.mk в C:\Users\intel-user\Desktop\cocos2d-x-3.3rc0\Project\MyGame\proj.android\jni
Расположение файла Application.mk
2. Добавьте в этот файл следующую строку:
Application.mk после добавления строки APP_ABI
Теперь, после добавления целевых архитектур, давайте скомпилируем нашу игру!
3. Используя подсказку командной строки, перейдите в папку фреймворка:
4. Выполните показанную ниже команду и запустите игру для Android:
Выполнение команды для компиляции и выполнения игры для Android
Если всё работает правильно, то команда cocos2d-console будет использовать adb (если это задано в переменных среды) для инсталляции файла APK на подключённом устройстве или инициализированном эмуляторе. При их отсутствии команда будет ожидать доступности устройства или эмулятора, как показано ниже:
Команда ожидает устройства или инициализированного эмулятора
При наличии подключенного устройства или инициализированного эмулятора появится следующий экран:
Экран игровой программы на платформе Android
Создание приложений Win32 (для ПК под Windows 7 или Windows 8)
Нам потребуется Visual Studio 2012 или более поздняя версия.
1. Используя приглашение командной строки (cmd.exe), перейдите в папку, куда был распакован фреймворк:
2. Для компиляции и запуска игры на выполнение в среде Windows введите команду:
Выполнение команды компиляции и запуска игры в Windows
Если всё работает правильно, то после выполнения команды run вы увидите следующий экран:
Экран игры на платформе Windows
Для компиляции и запуска проекта игры можно использовать Visual Studio:
1. В директории Project откройте файл Visual Studio MyGame.sln в папке “proj.win32”.
Структура директории проекта Win32
Проект Win32, открытый в Visual Studio
Итак, теперь вы знаете, как создать и скомпилировать игру для Android (x86 и ARM), Windows 7 и Windows 8 (в режиме десктопа), браво 🙂
Чуть не забыли
В настоящее время в версии Cocos2d-x 3.3 есть проблема – инструментарий не позволяет создавать проекты (подробности здесь). Эта проблема исправлена в последней предварительной редакции, но в последнем релизе Cocos2d-x пока остается.
Подробности по оптимизации компиляции смотрите в наших замечаниях по оптимизации.
Cocos2D-X и чтобы легко на всех устройствах
Несколько лет делал заказные игрульки под iOS. В условиях, когда некогда точить, а нужно пилить, идешь в гугл и спрашиваешь. Гуглокодинг. Вот и свела судьба меня с Cocos2D for iPhone и теплым ламповым www.raywenderlich.com
Мне Objective-C понравился, как и сам cocos2D. Мягкий как пластилин. После приличных лет писанины на C++ все как-то упростилось. Увы, только iOS. Безусловно, появились всякие Apportable, однако я не хотел почему-то смотреть в ту сторону. К тому же чувствовалась усталость от одной и той же платформы и хотелось своего проекта, при том, чтобы игралось на каждой микроволновке. Unity вроде хорош, но закрыт, а для меня очень важно знать, как оно работает изнутри: оценить потенциальные боттлнеки, что-то оптимизировать (приходилось часто за практику), да даже просто баги пофиксить. Плюс, хотелось начать что-то делать прям сейчас. А поскольку с моделью айфоновского кокоса я был очень хорошо знаком, было принято решение взглянуть на cocos2D-X. Тот, что на C++.
То же самое. Просто на С++. Те же release/retain (в последней 3.x версии некоторые моменты уже изменились), та же модель из нод. Погонял тестовый стенд (всегда, всегда смотрите примеры работы движка) — все шустро работает. Вспомнил я, правда, про одну штуку — про Android с его множеством разрешений экранов.
Когда я делал игры под айфоны, все было просто. Если нужна была поддержка ретины, то достаточно было установить лишь один флаг:
и добавить набор HD-графики. Под айпэды все было слегка иначе: требовался некоторый перерасчет координат. С появлением пятых айфонов все чуть усложнилось, но немножко. Однако, когда ты Андроид и у тебя почти неограниченное количество всяких экранов, нужно немного включить мозг. Вот, что мы сделали.
Мы добавили конфиги. Вся магия твоего проекта начинает происходить в сгенерированном кокосовским скриптом классе AppDelegate. В одном из его методов запускается и активируется сцена:
В сцене ты грузишь свои спрайты/иные ноды, как-то их позиционируешь, крутишь, если потребуется, и т.д. Механизм создания, например, спрайта тесно связан с классом FileUtils. Всякий раз, когда ты творишь что-то вроде:
внутренние методы (хорошо иметь код под рукой) класса Sprite просят FileUtils побегать по списку установленных путей поиска и посмотреть, есть ли там такой-то файл. Пути поиска? Да это просто. Можно создавать спрайты так:
а можно сказать кокосу, что у нас есть некоторая директория или даже список, в которых следует искать файлы. Это сокращает писанину, соответственно, уменьшает количество ошибок и придает гибкости. Захотел сгруппировать файлы иным образом — пожалуйста, в коде не придется менять все «enemies/» на, к примеру, «objects/». Действительно удобнои легко:
Что-то я, кажется, говорил про всякие разрешения экранов. В cocos2D-X уже нет всяких
вместо этого появилась пара новых вещей. Хочешь узнать физический размер экрана? Сделай так:
Еще я что-то говорил про конфиг. Это простой json-файл (парсим rapidson), в котором мы прописали наборы путей ресурсов (ох, этот винительный падеж). Каждый набор выглядит так:
Здесь width и height представляют физические размеры, для которого этот набор ресурсов мог бы подойти. Уже улавливаешь, к чему я клоню? При старте приложения в AppDelegate::applicationDidFinishLaunching я загружаю конфиг, бегаю по всем наборам путей и сверяю физический размер, полученный из Director::getInstance()->getOpenGLView()->getFrameSize(), с теми width и height и загружаю нужных размеров картинки. Этого, однако недостаточно.
Для практического же использования достаточно знать следующее. Есть Director::getInstance()->getOpenGLView()->setDesignResolutionSize(), который устанавливает относительные размеры. Твой айфон, например, имеет размер 960×640 и центр экрана может быть представлен координатой <480, 320>. Однако, можно передать в setDesignResolutionSize какие-нибудь <96, 64>, и тогда центр можно будет задать с помощью <48, 32>. Относительные координаты очень важны, а те два параметра designWidth и designHeight из конфига их и выставляют. Итак, мы бегаем по конфигу, сверяем размеры, грузим нужные ресурсы и устанавливаем правильные относительные координаты. Мы почти на финишной прямой.
Представь, что ты запускаешь игру на устройстве с огромным разрешением экрана, но набора ресурсов, чтобы прям pixel perfect, нет. Ничего страшного — мы просто скажем кокосу, чтобы он растянул картинку. Для этого есть Director::getInstance()->setContentScaleFactor(), принимающий некоторый float. Просто подели (в случае, если игра портретная) width из конфига на designWidth и будет тебе счастье на всех платформах.
Есть еще один параметр, последний — ResolutionPolicy. Если честно, то полезных там два штуки: ResolutionPolicy::FIXED_WIDTH и ResolutionPolicy::FIXED_HEIGHT. Хочешь играть в портретной ориентации — ставь ResolutionPolicy::FIXED_WIDTH. При этом, картинка растянется по ширине, например, как в моей игре solve Me:
При таком подходе может появиться дополнительно вертикальное пространство. В примере выше я просто растягивал фон так, чтобы замостился весь экран, а элементы интерфейса располагал относительно его краев. Однако, это работает не всегда. Так, в другой моей игре reTales с ландшафтной ориентацией (использовался ResolutionPolicy::FIXED_HEIGHT) я просто рисовал два спрайта по краям экрана:
Бегаем по конфигу, считываем наборы путей, сравниваемся с физическими размерами, грузим нужные ресурсы, применяем верную политику и растягиваемся. Но я пошел еще чуть дальше — прикрутил локализацию. На уровне движка. Особенность FileUtils::getInstance()->addSearchPath() в том, ресурсы будут искаться строго по тем путям, которые были установлены, и в том же порядке. Не нашел в «fonts/», идет в «ui/», не нашел там — идет в «maps/» и далее ищет в корне в случае неудачи. Прекрасно. Мы ведь можем получить текущий язык с помощью Application::getInstance()->getCurrentLanguage() и в момент добавления пути добавить сначала путь, характерный для конкретного языка, а потом и сам этот путь. Лучше один раз увидеть. Будет происходить примерно следующее:
В итоге, при попытке создать спрайт кокос сначала посмотрит в локализованную папку, потом в папку общую. Нужно, чтобы шрифты грузились в зависимости от языка по-умолчанию? Просто создай папку. Нужно, чтобы конкретные спрайты (флаг на нашивке солдата) грузились в соответствии с языком игрока? Создай папку и кинь туда нужный файл. Сам текст просто лежит в таких же json-файлах как и конфиг. Вместо
Класс Localized и многое другое ты сможешь скачать по ссылкам ниже. Мне не жалко 🙂
Спасибо, чтобы был со мной, читатель. Не забывай кормить своего кота — он очень в тебе нуждается.
Cocos2d-x — разработка простой игры
1. Вводная часть
В этой статье речь пойдет о разработке прототипа игры под Android/Linux с помощью Cocos2d-x. Cocos2d-x это кросс-платформенный фреймворк для создания двумерных игр и других графических приложений. Он создан на основе cocos2d-iphone, но вместо Objective-C Cocos2d-x использует C++. Приложения могут быть запущены на платформах: iOS, Android, Windows Phone, OS X, Windows, Linux.
Эта статья о разработке приложения под Android/Linux, платформа разработки — Ubuntu.
К сожалению, Cocos IDE существует только под Window и Mac, а под Linux версии не предвидится, но так как я очень люблю Ubuntu и это та платформа, с которой я работаю каждый день, я использую для разработки Clion.
Некоторые части этой статьи — перевод соответствующих частей документации (http://www.cocos2d-x.org/wiki).
Статья ориентирована на тех, кто начинает свое знакомство с Cocos2d-x. В ней я расскажу о том, как создать самое простое приложение со спрайтами, сценами и как работать с акселерометром. Это может быть неким стартом, чтобы в будущем идти дальше, углубляясь в API Cocos2d-x.
2. Требования
Определим необходимый набор инструментов, который нам понадобится.
Ubuntu 14.04 — платформа разработки
Cocos2d-x v3.8.1 — https://cocos2d-x.org/download
CMake 2.8+
JDK 1.6+
Android SDK
Android NDK r9d+
Apache Ant — для сборки Android-сборки
Python 2.7.5
Clion 1.1 — www.jetbrains.com/clion
3. Cocos2d-x
Cocos2d-x появился в 2010 году, это проект с открытым исходным кодом, распространяющейся под лицензией MIT. Cocos2d-x позволяет писать на таких языках как C++, Lua и Javascript. Cocos2d-x быстрый, простой и обладает большими возможностями. В настоящее время много игр, написанных с помощью этого фреймворка, находятся в топе AppStore и Google Play.
«Большие ребята», такие как Zynga, Wooga, Glu, Big Fish Games, Konami используют Cocos2d-x для разработки игр.
Тут я должен сделать маленькое отступление. Дело в том, что Cocos2d-x позволяет использовать C++ для написания кода, и все это будет собираться под Android и Linux. Если использовать Cocos2d-JS, то можно писать на Javascript. Тогда в случае сборки для на Linux/Ubuntu код будет транслироваться в C++, а затем компилироваться. Это влечет много разных проблем (усложняет работу со сторонними библиотеками, например). В случае же web будет выполнятся java-script (кстати, время сборки в этом случае равна нулю, что неплохо).
Если же использовать Cocos2d-x, то под web это не работает, но под Linux и Android код компилируется напрямую. Для Android, конечно же, используется Android NDK.
Главные особенности:
4. Установка и запуск приложения
Эта часть статьи показывает как создать и запустить первое приложение.
Для начала, нам необходимо загрузить и распаковать Cocos2d-x. Или же можно использовать последнюю версию из репозитория:
После того, как все было успешно загружено, нужно, нужно установить все зависимости. Для этого можно запустить скрипт*:
* Здесь и далее предполагается, что cocos2d-x-3.8.1 распакован в каталог
Или же устанавливаем их вручную:
Для установки glfw3 нужно запустить еще один скрипт.
После чего, запускаем установку:
Запустим cmake для создания makefile:
Теперь осталось запустить тестовое приложение:
Всё. Если все прошло хорошо, вы должны увидеть тестовое приложение, что-то вроде демо-версии. Если все получилось, то можно идти дальше. Нам нужно создать проект.
Для создания приложения, запускаем:
где MyGame — имя, cpp — язык. Можно указать js или lua. Но мы указываем cpp.
Теперь проект создан, с ним мы и будем дальше работать. Пустой проект содержит лейбл и картинку. Можно сразу на это посмотреть:
Вот, собственно, и можно начинать работать.
5. Clion
Как я уже писал, Cocos IDE нет для Ubuntu, но ведь нам не хочется писать код в блокноте? К счастью, существует Clion от Jetbrains.
Clion поддерживает cmake, а это значит, что достаточно просто импортировать проект MyGame, и можно писать код. И не просто писать, но и отлаживить его! Правда, запускается все это под Linux. Но, я думаю, что для начала этого вполне достаточно. После отладки приложение для Android всегда можно собрать через консоль.
6. Основы
Итак, мы загрузили Cocos2d-x, установили все инструменты, импортировали проект в Clion, запустили и… и теперь пора разобраться, что к чему. Начнем.
Cocos2d-x это кросс-платформенный игровой движок. Но что такое игровой движок? Игровой движок предоставляет общую функциональность которая должна быть у всех игр. Он включает в себя компоненты, которые вместе позволяют ускорить разработку. Например renderer (Часть терминов в статье я не перевожу, так как они общеприняты. Слово «Активность» я тоже использовать не буду), графику, механизм обнаружения столкновений, физику, звук, анимацию. Cocos2d-x предоставляет простой API для разработки кросс-платформенных приложений (вернее, позволяет собирать приложение под разные платформы).
Cocos2d-x предоставляет такие объекты как Scene, Transition, Sprite, Menu, Sprite3D, Audio и другие.
Главные компоненты
В начале может показаться не так, но на самом деле начать работать с Cocos2d-x очень просто. Ядро Cocos2d-x это Scene, Node, Sprite и Action. Посмотрим, что их них что.
Большинство игр выглядит как-то так:
Вот все эти компоненты:
Director
Director в Cocos2d-x это как режиссер на съемочной площадке. Он контролирует все объекты и говорит им, что они должны делать. Director управляет сменой сцен и эффектами перехода, он является синглтоном и доступен отовсюду (хотя в кино, наверно, не так).
Scene
В вашей игре скорее всего будет меню, несколько уровней, и еще несколько экранов («Вы проиграли!»). Каждый такой экран — это сцена (Scene). Опять же, как в кино. Каждое кино разбито на сцены — отдельные части одной истории. Сцена отрисовывается объектом Renderer. Renderer отвечает за отрисовку спрайтов и других объектов сцены. Для лучшего понимания это процесса, поговорим о Scene Graph.
Scene Graph
Scene Graph это структура данных, которая используется в Scene. Scene Graph содержит узлы (Node). Кстати говоря, Scene Graph называется Scene Graph, но на самом деле это дерево.
Это уже выглядит слегка сложновато. Вы должны спросить, на кой черт мне нужно знать о том, как устроена Scene внутри, если мне просто нужен двигающийся человечек? Это важно для понимания того, как именно отрисовывается Scene. Добавляя спрайты и анимацию в вашу игры вы должны быть уверены, что получите результат, который хотите.
Cocos2d-x выполняет симметричный обход дерева (при котором посещается сначала левое поддерево, затем узел, затем — правое поддерево). Это значит, что правая часть дерева отрендерится последней, и значит, будет видна «сверху» (то есть визуально остальные — под ней).
Проиллюстрировать это очень легко, давайте просто взглянем на эту сцену:
Которую упрощенно (часть объектов являются не листами, а ветками) можно представить в виде дерева:
Связанный с порядком атрибут это z-order. Левая часть дерева имеет отрицательный z-order, в том время как правая — положительный. Можно держать это в голове, чтобы избежать ошибок. Плюс к этому, вы можете добавлять элементы в любом порядке с указанным z-order, тогда элементы будут отсортированы автоматически.
Можно рассматривать Scene как набор объектов (Node). Разобьем сцену, показанную выше, чтобы посмотреть scene graph:
Сцена слева это сложенные вместе узлы (Node) имеющие разный z-order, которые определяют порядок их отрисовки.
Добавить элемент к сцене можно вызвав API:
Sprites
Все игры используют спрайты. Это те штуки, которые двигаются по экрану. Вы можете управлять ими. Главный герой игры, скорей всего, является спрайтом. Важно отметить: не каждый графический элемент игры это спрайт. Если элемент не перемещается по экрану, то это просто узел (Node).
Взглянем еще раз на сцену из игры:
Спрайты это ключевые элементы игры. Создать спрайт очень легко:
Actions
Создание сцены с добавление спрайтов на экран это только часть задачи. Ведь нам еще надо, чтобы все это двигалось. Для этого и существуют экшены (Actions). Движение, повороты, вращение — это все экшены. Экшены очень похожи на ValueAnimator в Android API.
Система координат
Надо заметить, что Cocos2d использует декартову систему координат. То есть точка (0, 0) находится слева внизу. Это отличает Cocos2d, скажем, от того же Android API.
7. Идея игры
Дальше мы создадим некий прототип игры, чтобы проиллюстрировать работу с Cocos2d. Идея игры очень проста: по экрану хаотично передвигаются объекты, допустим, смайлики (а почему нет?), и есть кто-то, кто их должен есть. А от грустных смайлов наоборот, стараться скрыться. Причем управление пожирателем происходит за счет отклонения телефона в разные стороны. Таким образом, мы задействуем спрайты, экшены, смену сцен, работу с акселерометром.
Понятно, что идея очень проста и скучна, но мы не ставим задачу заработать миллион (но только пока что, да?), а нам нужно разобраться что к чему в Cocos2d, и эта идея вполне подходит. Что ж, начнем!
8. Добавление спрайтов
За основу возьмем приложение MyGame, которое мы создавали в начале статьи. Нам пригодятся смайлы, которые без труда можно найти на просторах интернета, или же их можно заменить чем-то другим. Шарами какими-нибудь.
Все ресурсы надо положить в каталог Resources.
Добавим в метод init() следующий код:
listSprites это список всех смайлов, нам он пригодится чтобы добавить перемещение по экрану. Сделаем еще заодно и так, чтобы они немного вращались, в процессе движения:
Здесь мы создаем Spawn и Sequence, чтобы выполнить два экшена одновременно, и плюс к этому, в Sequence мы передаем callback — ссылку на функцию, которая вызовется, когда экшен выполнится. Это позволит нам перезапускать экшен каждый раз, чтобы спрайты двигались бесконечно. Надо создать такой экшен для каждого спрайта.
Метод randomEndPoint возвращает точку на границе экрана, выбранную случайным образом.
Теперь у нас есть много двигающихся спрайтов:
Еще нам надо добавить пожирателя, но это делается аналогично, не будем на этом останавливаться.
9. Разрешение коллизий
Теперь нам надо написать немного кода для разрешения коллизий. То есть, обнаружить момент когда мелкие смайлы будут касаться пожирателя.
Для этого, переопределим метод onUpdate:
Чтобы это метод вызывался при обновлении экрана вызываем scheduleUpdate():
Теперь при каждом обновлении экрана (и изменении позиций спрайтов, соответственно) будет вызываться метод update. Для простоты можно написать что-то вроде такого:
Когда коллизия найдена, можно посчитать очки и перезапустить Action:
10. Акселерометр
Работать с акселерометром также просто, как разрешать коллизии, даже проще.
Для начала, подпишемся на нужное событие:
Чтобы получать значения акселерометра переопределим метод onAcceleration:
Вычислив eaterPointsPerSecX и eaterPointsPerSecY в методе update вызываем setPosition():
Конечно, в реальной игре надо еще следить чтобы наш пожиратель не вышел за границы экрана. Но пока что остановимся на этом.
Итак, мы создали летающие смайлы, добавили поедателя, управляем им с помощью акселерометра… осталось, добавить экран «Game Over!».
11. Game Over!
Вот тут нам понадобится новая сцена. Можно подсмотреть в HelloWorld и создать ее по образцу. Так мы и поступим:
Почти все, что здесь написано, нам уже известно.
Здесь, по аналогии с HelloWorld мы создаем лейбл который является элементом меню, то есть мы можем обработать событие onClick. Создавая MenuItemLabel мы передаем одним из параметров ссылку на функцию startAgaingCallback, в которой меняем сцену. Заметим, что меняем сцену еще и с применением эффекта TransitionFade.
Точно также мы можем поменять сцену игры на GameOverScene: