今天要学习的是coscos2d-x官网索引的一篇初级游戏教程。作为小白的入门,再适合不过了。
资源文件下载
工程源码下载
大师的源码
环境:
lubuntu 13.10 32bit Android 4.1 cocos2d-x 2.2
下面就一步步来完成。
在Eclipse中刷新工程,Resources文件夹就出现了。
换一个狂拽酷炫点的图标
将android工程中res文件夹下的icon.png换成这个就可以了。
将下载好的资源文件挨个拷贝到Resources文件夹中,注意Classes 文件夹不要拷贝,fonts文件夹合并就好。
先将HelloWorldScence.cpp中的
USING_NS_CC;
移动到HelloWorldScence.h中,这样定义成员的时候就不用老加上命名空间了。
首先在HelloWorld.h中添加两个成员:
private: CCSpriteBatchNode* batchNode; CCSprite* ship;
batchNode = CCSpriteBatchNode::create("Spritesheets/Sprites.pvr.ccz"); this->addChild(batchNode); CCSpriteFrameCache::sharedSpriteFrameCache()->addSpriteFramesWithFile("Spritesheets/Sprites.plist"); ship = CCSprite::createWithSpriteFrameName("SpaceFlier_sm_1.png"); ship->setPosition(ccp(origin.x + visibleSize.width * 0.1, origin.y + visibleSize.height * 0.5)); batchNode->addChild(ship,1);
在头文件中继续添加几个相关的private成员:
CCParallaxNode *backgroundNode; CCSprite *spacedust1; CCSprite *spacedust2; CCSprite *planetsunrise; CCSprite *galaxy; CCSprite *spacialanomaly; CCSprite *spacialanomaly2;
这里用到了CCParallaxNode类,用它来实现背景,可以加强背景的层次感,在进行背景卷动的时候,可以实现越近的背景卷动得越快,越远越慢。(想想在火车上 向外看窗外的景色)
// 1) Create the CCParallaxNode backgroundNode = CCParallaxNode::create(); this->addChild(backgroundNode, -1); // 2) Create the sprites will be added to the CCParallaxNode spacedust1 = CCSprite::create("Backgrounds/bg_front_spacedust.png"); spacedust2 = CCSprite::create("Backgrounds/bg_front_spacedust.png"); planetsunrise = CCSprite::create("Backgrounds/bg_planetsunrise.png"); galaxy = CCSprite::create("Backgrounds/bg_galaxy.png"); spacialanomaly = CCSprite::create("Backgrounds/bg_spacialanomaly.png"); spacialanomaly2 = CCSprite::create("Backgrounds/bg_spacialanomaly2.png"); // 3) Determine relative movement speeds for space dust and background CCPoint dustSpeed = ccp(0.1, 0.1); CCPoint bgSpeed = ccp(0.05, 0.05); // 4) Add children to CCParallaxNode backgroundNode->addChild(spacedust1, 0, dustSpeed, ccp(0,visibleSize.height/2) ); // 2 backgroundNode->addChild(spacedust2, 0, dustSpeed, ccp( spacedust1->getContentSize().width,visibleSize.height/2)); backgroundNode->addChild(galaxy, -1, bgSpeed, ccp(0, visibleSize.height * 0.7)); backgroundNode->addChild(planetsunrise, -1 , bgSpeed, ccp(600, visibleSize.height * 0)); backgroundNode->addChild(spacialanomaly, -1, bgSpeed, ccp(900, visibleSize.height * 0.3)); backgroundNode->addChild(spacialanomaly2, -1, bgSpeed, ccp(1500, visibleSize.height * 0.9));
原理就是每一Frame将背景向后移动一定的距离,也就是背景图片以一定的速度运动。
在头文件中添加update函数,将其声明为似有成员函数,这个函数是会自动调用的。
private: // scheduled Update void update(float dt);
void HelloWorld::update(float dt) { CCPoint backgroundScrollVert = ccp(-1000,0); backgroundNode->setPosition(ccpAdd(backgroundNode->getPosition(), ccpMult(backgroundScrollVert, dt))); }
this->scheduleUpdate();
而CCParallaxNode也没有对应的循环的方法,这里就要自定义类了。这里自定义一个CCParallaxNodeExtras类,继承 CCParallaxNode。主要是添加一个 incrementOffset() 方法,用户实现循环显示。
CCParallaxNodeExtras.h
#ifndef Cocos2DxFirstIosSample_CCParallaxNodeExtras_h #define Cocos2DxFirstIosSample_CCParallaxNodeExtras_h #include "cocos2d.h" USING_NS_CC; class CCParallaxNodeExtras : public CCParallaxNode { public : // Need to provide a constructor CCParallaxNodeExtras(); // just to avoid ugly later cast and also for safety static CCParallaxNodeExtras * node(); // Facility method (it’s expected to have it soon in COCOS2DX) void incrementOffset(CCPoint offset, CCNode* node); } ; #endif
#include "CCParallaxNodeExtras.h" // Hack to access CCPointObject (which is not a public class) class CCPointObject : CCObject { CC_SYNTHESIZE(CCPoint, m_tRatio, Ratio) CC_SYNTHESIZE(CCPoint, m_tOffset, Offset) CC_SYNTHESIZE(CCNode *, m_pChild, Child) // weak ref }; // Need to provide a constructor CCParallaxNodeExtras::CCParallaxNodeExtras() { CCParallaxNode(); // call parent constructor } CCParallaxNodeExtras * CCParallaxNodeExtras::node() { return new CCParallaxNodeExtras(); } void CCParallaxNodeExtras::incrementOffset(CCPoint offset,CCNode* node){ for( unsigned int i = 0; i < m_pParallaxArray->num; i++) { CCPointObject *point = (CCPointObject *)m_pParallaxArray->arr[i]; CCNode * curNode = point->getChild(); if( curNode->isEqual(node) ) { point->setOffset( ccpAdd(point->getOffset(), offset) ); break; } } }
在这里还定义了一个内部类CCPointObject,关于CC_SYNTHESIZEz这个宏
#define CC_PROPERTY(varType, varName, funName)\ protected: varType varName;\ public: virtual varType get##funName(void);\ public: virtual void set##funName(varType var);
对原HelloWorldScence.cpp进行一定的修改,首先backgroundNode的声明要修改:
CCParallaxNodeExtras *backgroundNode;
backgroundNode = CCParallaxNodeExtras::node();
CCArray *spaceDusts = CCArray::arrayWithCapacity(2) ; spaceDusts->addObject(_spacedust1) ; spaceDusts->addObject(_spacedust2) ; for ( int ii = 0 ; ii <spaceDusts->count() ; ii++ ) { CCSprite * spaceDust = (CCSprite *)(spaceDusts->objectAtIndex(ii)) ; float xPosition = _backgroundNode->convertToWorldSpace(spaceDust->getPosition()).x ; float size = spaceDust->getContentSize().width ; if ( xPosition < -size ) { _backgroundNode->incrementOffset(ccp(spaceDust->getContentSize().width*2,0),spaceDust) ; } } CCArray *backGrounds = CCArray::arrayWithCapacity(4) ; backGrounds->addObject(_galaxy) ; backGrounds->addObject(_planetsunrise) ; backGrounds->addObject(_spacialanomaly) ; backGrounds->addObject(_spacialanomaly2) ; for ( int ii = 0 ; ii <backGrounds->count() ; ii++ ) { CCSprite * background = (CCSprite *)(backGrounds->objectAtIndex(ii)) ; float xPosition = _backgroundNode->convertToWorldSpace(background->getPosition()).x ; float size = background->getContentSize().width ; if ( xPosition < -size ) { _backgroundNode->incrementOffset(ccp(2000,0),background) ; } }
SOURCES = main.cpp \ ../Classes/AppDelegate.cpp \ ../Classes/HelloWorldScene.cpp\ ../Classes/CCParallaxNodeExtras.cpp
android版本的编译需要修改proj.android/jni/Android.mk
LOCAL_SRC_FILES := hellocpp/main.cpp \ ../../Classes/AppDelegate.cpp \ ../../Classes/HelloWorldScene.cpp\ ../../Classes/CCParallaxNodeExtras.cpp
我们还可以在场景中添加一些星空的效果,可以用内置的粒子系统来实现,在init() 的后面添加下面的语句:
//Add some stars HelloWorld::addChild(CCParticleSystemQuad::create("Particles/Stars1.plist")); HelloWorld::addChild(CCParticleSystemQuad::create("Particles/Stars2.plist")); HelloWorld::addChild(CCParticleSystemQuad::create("Particles/Stars3.plist"));
这里用到了移动设备的重力传感器。cocos2d-x对加速计进行了封装,我们可以不用关心具体平台api,直接使用抽象后的加速计api就可以了。
首先是要实现基类的关于传感器的虚函数,在头文件中添加:
virtual void didAccelerate(CCAcceleration* pAccelerationValue);
void HelloWorld::didAccelerate(CCAcceleration* pAccelerationValue) { #define KFILTERINGFACTOR 0.1 #define KRESTACCELX -0.6 #define KMAXDIFFY 0.2 #define KMAXDIFFX 0.1 double rollingX = 0.0; double rollingY = 0.0; // Cocos2DX inverts X and Y accelerometer depending on device orientation // in landscape mode right x=-y and y=x !!! (Strange and confusing choice) //exchange value float tmp; tmp = pAccelerationValue->x; pAccelerationValue->x = pAccelerationValue->y; pAccelerationValue->y = tmp; rollingX = (pAccelerationValue->x * KFILTERINGFACTOR); rollingY = (pAccelerationValue->y * KFILTERINGFACTOR); float accelX = pAccelerationValue->x - rollingX; float accelY = pAccelerationValue->y - rollingY; CCSize winSize = CCDirector::sharedDirector()->getWinSize(); float accelDiffx = accelX - KRESTACCELX; float accelDiffy = accelY; float accelFractionx = accelDiffx / KMAXDIFFX; float accelFractiony = accelDiffy / KMAXDIFFY; shipPointsPerSecY = 0.5 * winSize.height * accelFractionx; shipPointsPerSecX = 0.5 * winSize.width * accelFractiony; }
这个函数在每次检测到传感器的信息之后就会回调,传回一个CCAcceleration对象,这里只要x方向的值就可以了。注意这里还对传感器的值进行了一定的处理,让小飞机有一种飞行的感觉,同时速度是和屏幕大小对应的,算是多设备匹配的一个trick。
接下来在update() 中更行飞船的位置,在后面添加下面的代码:
CCSize winSize = CCDirector::sharedDirector()->getWinSize(); float maxY = winSize.height - ship->getContentSize().height/2; float minY = ship->getContentSize().height/2; float maxX = winSize.width - ship->getContentSize().width/2; float minX = ship->getContentSize().width/2; float diffy = (shipPointsPerSecY * dt); float diffx = (shipPointsPerSecX * dt); float newY = ship->getPosition().y + diffy; float newX = ship->getPosition().x + diffx; newY = MIN(MAX(newY, minY), maxY); newX = MIN(MAX(newX, minX), maxX); ship->setPosition(ccp(newX, newY));
最后就是启动传感器的检测了,在init()中添加:
this->setAccelerometerEnabled(true);
在HelloWorld.h中添加几个私有成员变量,
CCArray* asteroids; int nextAsteroid; float nextAsteroidSpawn;
添加几个public辅助函数:
//For get random float value float randomValueBetween(float low, float high); //Set visibility of Node void setInvisible(CCNode * node); //Get millisecs current sys-time float getTimeTick();
在init()中对成员进行初始化:
//init asteroids asteroids = new CCArray(); //Store asteroids for(int i = 0; i < 15; ++i) { CCSprite *asteroid = CCSprite::createWithSpriteFrameName("asteroid.png"); asteroid->setVisible(false); batchNode->addChild(asteroid); asteroids->addObject(asteroid); } nextAsteroid = 0; nextAsteroidSpawn = 0.0;
float HelloWorld::randomValueBetween(float low, float high) { return (((float) 2 * rand() / 0xFFFFFFFFu) * (high - low)) + low; } float HelloWorld::getTimeTick() { timeval time; gettimeofday(&time, NULL); unsigned long millisecs = (time.tv_sec * 1000) + (time.tv_usec/1000); return (float) millisecs; } void HelloWorld::setInvisible(CCNode * node) { node->setVisible(false); }
//Set asteroids float curTimeMillis = getTimeTick(); if (curTimeMillis > nextAsteroidSpawn) { float randMillisecs = randomValueBetween(0.20,1.0) * 1000; nextAsteroidSpawn = randMillisecs + curTimeMillis; float randY = randomValueBetween(0.0,winSize.height); float randDuration = randomValueBetween(2.0,10.0); CCSprite *asteroid = (CCSprite *)asteroids->objectAtIndex(nextAsteroid); nextAsteroid++; if (nextAsteroid >= (int)asteroids->count()) nextAsteroid = 0; asteroid->stopAllActions(); asteroid->setPosition( ccp(winSize.width+asteroid->getContentSize().width/2, randY)); asteroid->setVisible(true); asteroid->runAction(CCSequence::create(CCMoveBy::create(randDuration, ccp(-winSize.width-asteroid->getContentSize().width, 0)), CCCallFuncN::create(this, callfuncN_selector(HelloWorld::setInvisible)), NULL // DO NOT FORGET TO TERMINATE WITH NULL (unexpected in C++) )); }
和小行星的添加类似,首先修改头文件
CCArray* shipLasers; int nextShipLaser;
//init lasers shipLasers = new CCArray(); for(int i = 0; i < 5; ++i) { CCSprite *shipLaser = CCSprite::createWithSpriteFrameName("laserbeam_blue.png"); shipLaser->setVisible(false); batchNode->addChild(shipLaser); shipLasers->addObject(shipLaser); } this->setTouchEnabled(true); nextShipLaser = 0;
这里的碰撞检测包括两个部分:激光和小行星的碰撞,飞机和小行星的碰撞。
首先添加一个私有成员,用于记录飞机的生命值。
int lives;
在init()添加对其的初始化:
lives = 3;
在update()中添加检测的操作:
//Collision Detection //Asteroids CCObject* asteroid; CCObject* shipLaser; CCARRAY_FOREACH(asteroids, asteroid){ if (!((CCSprite *) asteroid)->isVisible() ) continue; CCARRAY_FOREACH(shipLasers, shipLaser){ if (!((CCSprite *) shipLaser)->isVisible()) continue; if (((CCSprite *) shipLaser)->boundingBox().intersectsRect(((CCSprite *)asteroid)->boundingBox()) ) { ((CCSprite *)shipLaser)->setVisible(false); ((CCSprite *)asteroid)->setVisible(false); continue; } } if (ship->boundingBox().intersectsRect(((CCSprite *)asteroid)->boundingBox()) ) { ((CCSprite *)asteroid)->setVisible(false); ship->runAction( CCBlink::create(1.0, 9)); lives--; } }
理论上当飞机生命没有的时候,游戏就要结束了。
这里游戏的胜利条件是坚持了60s,失败条件是飞机被撞击了三次。
添加一个枚举声明,表示游戏结束的原因:
typedef enum { WIN, LOSE } EndReason;
添加私有成员:
double gameOverTime; bool gameOver;
//Called when game ended void endScene(EndReason endReason); //Restart game void restartTapped();
void HelloWorld::restartTapped() { CCDirector::sharedDirector()->replaceScene (CCTransitionZoomFlipX::create(0.5, this->scene())); // reschedule this->scheduleUpdate(); } void HelloWorld::endScene( EndReason endReason ) { if (gameOver) return; gameOver = true; CCSize winSize = CCDirector::sharedDirector()->getWinSize(); char message[10] = "You Win"; if ( endReason == LOSE) strcpy(message,"You Lose"); CCLabelBMFont * label ; label = CCLabelBMFont::create(message, "fonts/Arial.fnt"); label->setScale(0.1); label->setPosition(ccp(winSize.width/2 , winSize.height*0.6)); this->addChild(label); CCLabelBMFont * restartLabel; strcpy(message,"Restart"); restartLabel = CCLabelBMFont::create(message, "fonts/Arial.fnt"); CCMenuItemLabel *restartItem = CCMenuItemLabel::create(restartLabel, this, menu_selector(HelloWorld::restartTapped) ); restartItem->setScale(0.1); restartItem->setPosition( ccp(winSize.width/2, winSize.height*0.4)); CCMenu *menu = CCMenu::create(restartItem, NULL); menu->setPosition(CCPointZero); this->addChild(menu); // clear label and menu restartItem->runAction(CCScaleTo::create(0.5, 1.0)); label ->runAction(CCScaleTo::create(0.5, 1.0)); // Terminate update callback this->unscheduleUpdate(); }
运行效果如下:
游戏中的音效可以为游戏添色不少。
首先将苹果的caf格式转换成android支持的wav.终端cd到工程目录下的 Resources/Sounds ,执行下面的命令(事先装好ffmpeg)
ffmpeg -i SpaceGame.caf SpaceGame.wav
ffmpeg -i explosion_large.caf explosion_large.wav
ffmpeg -i laser_ship.caf laser_ship.wav
顺利的话Sounds文件夹下面就生成了转好码的音频文件了。
在HelloWorld.h 中添加头文件和命名空间:
#include "SimpleAudioEngine.h" using namespace CocosDenshion;
在init() 中加入对音效的初始化,这里播放背景乐,同时预加载小行星爆炸的音效和发射激光的音效。
SimpleAudioEngine::sharedEngine()->playBackgroundMusic("SpaceGame.wav",true); SimpleAudioEngine::sharedEngine()->preloadEffect("explosion_large.wav"); SimpleAudioEngine::sharedEngine()->preloadEffect("laser_ship.wav");
在碰撞检测中对应位置加入
SimpleAudioEngine::sharedEngine()->playEffect("Sounds/explosion_large.wav");
在触摸函数中添加
SimpleAudioEngine::sharedEngine()->playEffect("Sounds/laser_ship.wav");
发现linux版本不能正常编译,报错:
fatal error: SimpleAudioEngine.h: No such file or directory compilation terminated.
修改proj.linux/MakeFile
EXECUTABLE = SpaceGame INCLUDES = -I.. -I../Classes \ -I$(COCOS_ROOT)/CocosDenshion/include SOURCES = main.cpp \ ../Classes/AppDelegate.cpp \ ../Classes/HelloWorldScene.cpp\ ../Classes/CCParallaxNodeExtras.cpp COCOS_ROOT = ../../.. include $(COCOS_ROOT)/cocos2dx/proj.linux/cocos2dx.mk SHAREDLIBS += -lcocos2d -lcocosdenshion COCOS_LIBS = $(LIB_DIR)/libcocos2d.so $(TARGET): $(OBJECTS) $(STATICLIBS) $(COCOS_LIBS) $(CORE_MAKEFILE_LIST) @mkdir -p $(@D) $(LOG_LINK)$(CXX) $(CXXFLAGS) $(OBJECTS) -o $@ $(SHAREDLIBS) $(STATICLIBS) $(OBJ_DIR)/%.o: %.cpp $(CORE_MAKEFILE_LIST) @mkdir -p $(@D) $(LOG_CXX)$(CXX) $(CXXFLAGS) $(INCLUDES) $(DEFINES) $(VISIBILITY) -c $< -o $@ $(OBJ_DIR)/%.o: ../%.cpp $(CORE_MAKEFILE_LIST) @mkdir -p $(@D) $(LOG_CXX)$(CXX) $(CXXFLAGS) $(INCLUDES) $(DEFINES) $(VISIBILITY) -c $< -o $@
主要是搜索路径和库的链接。然后linux版本就可以编译了。
android版本直接编译运行即可。
到此为止,已经基本完成了一个声色俱全的移动平台游戏了~
可以做的还有很多,比如
1.给飞机添加血量的显示;
2.添加爆炸的动画;
3.添加敌机;
4.遭遇大boss
...
Cocos2D-X Tutorial for iOS and Android: Space Game