Уроки iPhone SDK: Cocos2d: Работа с переходами

Июн 11

iPhone SDK - Уроки | Автор Artem Add comments

Данный урок подразумевает знакомство с Cocos2d для iPhone (здесь мы будем работать с Cocos2d v. 0.7.1). Для базовой информации по Cocos2d можно прочесть инструкцию по установке здесь и урок Hello World.

Введение

К переходам, которые используются для переключения между объектами Cocos2d Scene, относятся такие эффекты, как wipe (вытеснение), fade (постепенное появление / исчезновение), zoom (масштабирование) и split (разделение). Класс “Scene” — производная “CocosNode“, по свойствам аналогичная “Layer“. В любой объект “Scene” можно добавить еще один “CocosNode“, например, “Layer” (один или несколько) или “Sprite” (один или несколько). Для обработки перехода служит представленный ниже код:

1	+(id) transitionWithDuration:(ccTime) t scene:(Scene*)s;

где “scene” — сцена, которая, появляясь, сменяет текущую, “time” — число секунд, которые длится переход. При применении перехода к сценам синтаксис будет следующим:

1	[[Director sharedDirector] replaceScene: [TransitionClass transitionWithDuration:duration scene:nextScene]];

Встречаются переходы со специализированными параметрами. Так, например, в “FadeTransition” в качестве дополнительного параметра присутствует цвет.

Создание простого приложения

В Cocos2d немало готовых качественных переходов, с которыми можно ознакомиться, запустив пример TransitionsDemo (если нужна помощь по примеру, щелкните здесь. Все прекрасно, но несколько сложно из-за динамического генератора классов. В этом уроке мы выберем более простую и понятную тактику, которую можно читать своеобразным вступлением к TransitionDemo. Нам предстоит создать две сцены, добавить к ним изображения и настроить переходы от одной к другой.

Командой “New Project” создайте новый проект “Window-Based Application“.
Присвойте ему имя “Cocos2dTransition” (можно и любое другое, но в уроке я буду пользоваться именно им).
Импортируйте в проект файлы cocos2d: папка “cocos2d“, папка “external/Chipmunk/src“.
Добавьте “OpenGLES” и фреймворк “QuartzCore“.
Скопируйте в проект нужные для cocos2d изображения: “fps_images.png“, “Default.png“.

Более подробную информацию можно найти здесь http://permadi.com/blog/?p=128.

Создание сцен

Мы будем переключаться между “mScene1” и “mScene2“. Обратите внимание: наш класс реализует “TouchEventsDelegate“. Это обусловлено исключительно тем, что в нем будут обрабатываться события касания. Больше информации по делегированию читаем здесь. Импортируйте два изображения, которые будут отображаться в “mScene1” и “mScene2” (у меня это “scene1.png” и “scene2.png“). По размерам они обязательно должны соответствовать экрану iPhone — 480×320 пикселей.

scene1

scene2

Отредактируйте файл “Cocos2dTransitionAppDelegate.m” для инициализации “Cocos2d“, создайте и добавьте сцены в метод “applicationDidFinishLaunching“.

- (void)applicationDidFinishLaunching:(UIApplication *)application { // Открытие окна window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];  // cocos2d будет наследовать эти значения [window setUserInteractionEnabled:YES]; [window setMultipleTouchEnabled:NO];  // перед созданием какого-либо слоя установите альбомный режим просмотра [[Director sharedDirector] setLandscape: YES]; [[Director sharedDirector] setAnimationInterval:1.0/60]; [[Director sharedDirector] setDisplayFPS:YES]; [[Director sharedDirector] attachInView:window]; [[Director sharedDirector] addEventHandler:self];  CGSize size = [[Director sharedDirector] winSize]; int x = size.width; int y = size.height;  mScene1=[Scene node]; Sprite* sprite=[Sprite spriteWithFile:@"scene1.png"]; // выровняйте изображение по центру sprite.position = cpv(x/2, y/2); [mScene1 addChild:sprite]; [mScene1 retain];  mScene2=[Scene node]; sprite=[Sprite spriteWithFile:@"scene2.png"]; // Выровняйте изображение по центру sprite.position = cpv(x/2, y/2); [mScene2 addChild:sprite]; // сохраните, иначе ссылка пропадет [mScene2 retain];  // Начинаем с "mScene1" [[Director sharedDirector] runWithScene: mScene1]; [window makeKeyAndVisible]; }

В начале программы на экране отображается “mScene1“.

Добавление переходов

Теперь приступаем к тому, ради чего все это и затеяли — коду для осуществления перехода. В нашем случае переход — а именно “ZoomFlipXTransition” — будет инициализироваться касанием пользователем экрана.

-(BOOL)ccTouchesBegan:(NSSet*)touches withEvent:(UIEvent*)event { // Переключение между "mScene1" и "mScene2" Scene* nextScene=mScene1; if ([[Director sharedDirector] runningScene]==mScene1) nextScene=mScene2;  // НАЧАЛО КОДА ПЕРЕХОДА [[Director sharedDirector] replaceScene: [ZoomFlipXTransition transitionWithDuration:1.2f scene:nextScene]]; // КОНЕЦ КОДА ПЕРЕХОДА  return YES; }

Примечания

Все классы перехода можно найти в файле “cocos2d/Transition.h“. В основе каждого — “TransitionScene” с двумя объектными переменными: “inScene” и “outScene“. Текущая сцена используется “TransitionScene” в качестве “voutScene“. При желании можно, создавать на этой базе и собственные переходы. Попробуйте заменить рассмотренный в примере “ZoomFlipXTransition” на другой переход из файла “cocos2d/Transition.h” (не забывайте, что часть переходов требует внесения дополнительных параметров).