这篇文章中,我们将模仿某个游戏来实现,首页我们做首界面,这里都是一些UI元素的布局,其中会涉及到一些动画,比如贝塞尔曲线,还有cctableview来显示我们的得分,做个排行榜,OK,下面我直接上代码了:
HelloWorldScene.h
public:
// Method 'init' in cocos2d-x returns bool, instead of 'id' in cocos2d-iphone (an object pointer)
virtual bool init();
// there's no 'id' in cpp, so we recommend to return the class instance pointer
static cocos2d::CCScene* scene();
// preprocessor macro for "static create()" constructor ( node() deprecated )
CREATE_FUNC(HelloWorld);
private:
void initData(void);
void initUI(void);
void initSounds(void);
void addBaoshi(void);
cocos2d::CCProgressTimer *levelProgress;
cocos2d::CCLabelTTF *levelLabel;
cocos2d::CCLabelTTF *levelbfbLabel;
cocos2d::CCLabelTTF *timeLabel;
cocos2d::CCLayerColor *pauselayer;
cocos2d::CCSprite *sharebgSprite;
cocos2d::extension::CCTableView *phbTableView;
void buyYeZi(void);
void shared(void);
void startGame(void);
cocos2d::CCArray *yeziArray;
void removeSprite(void);
void createPauseLayer(void);
void pauseButtonPressed(void);
bool lock;
void rotateAnimation(void);
float rotate;
HelloWorldScene.cpp
bool HelloWorld::init()
{
//
// 1. super init first
if ( !CCLayer::init() )
{
return false;
}
this->initData();
this->initUI();
this->initSounds();
this->createPauseLayer();
return true;
}
void HelloWorld::initData()
{
CCSpriteFrameCache::sharedSpriteFrameCache()->addSpriteFramesWithFile("textures.plist");
yeziArray=CCArray::create();
yeziArray->retain();
dataArray=CCArray::create();
dataArray->retain();
}
void HelloWorld::initSounds()
{
SimpleAudioEngine::sharedEngine()->preloadBackgroundMusic("bg1.mp3");
SimpleAudioEngine::sharedEngine()->playBackgroundMusic("bg1.mp3", true);
}
void HelloWorld::initUI()
{
//背景
CCSprite *bgSprite=CCSprite::create("startbg.png");
bgSprite->setAnchorPoint(ccp(0.5, 0.5));
bgSprite->setPosition(ccp(wSize.width/2, wSize.height/2));
this->addChild(bgSprite, 1);
//宝石icon
CCSprite *baoshiiconSprite=CCSprite::createWithSpriteFrameName("ruby.png");
baoshiiconSprite->setAnchorPoint(ccp(0, 0));
baoshiiconSprite->setPosition(ccp(50, wSize.height-200));
this->addChild(baoshiiconSprite, 1);
//宝石数量
CCLabelTTF *bsnumsLabel=CCLabelTTF::create("100", "MarkerFelt-Thin", 35);
bsnumsLabel->setAnchorPoint(ccp(0, 0));
bsnumsLabel->setPosition(ccp(baoshiiconSprite->getPosition().x+baoshiiconSprite->getContentSize().width+25, wSize.height-200+15));
this->addChild(bsnumsLabel, 1);
//购买菜单
CCSprite *addSprite=CCSprite::createWithSpriteFrameName("add.png");
CCMenuItemSprite *addItem = CCMenuItemSprite::create(addSprite, addSprite, this, menu_selector(HelloWorld::addBaoshi));
addItem->setAnchorPoint(ccp(0, 0));
addItem->setPosition(ccp(bsnumsLabel->getPosition().x+bsnumsLabel->getContentSize().width+40, bsnumsLabel->getPosition().y-10));
CCMenu* pMenu = CCMenu::create(addItem, NULL);
pMenu->setPosition( CCPointZero );
this->addChild(pMenu, 1);
//等级进度条
CCSprite *progressbgSprite=CCSprite::createWithSpriteFrameName("exp_bar_out.png");
progressbgSprite->setAnchorPoint(ccp(0, 0));
progressbgSprite->setPosition(ccp(440, wSize.height-190));
this->addChild(progressbgSprite, 1);
CCSprite *progressSprite=CCSprite::createWithSpriteFrameName("exp_bar_in.png");
levelProgress=CCProgressTimer::create(progressSprite);
levelProgress->setType(kCCProgressTimerTypeBar);
levelProgress->setAnchorPoint(ccp(0, 0));
levelProgress->setPosition(ccp(440, wSize.height-182));
//进度动画运动方向,可以多试几个值,看看效果
levelProgress->setMidpoint(ccp(0, 0));
//进度条宽高变化
levelProgress->setBarChangeRate(ccp(1, 0));
levelProgress->setPercentage(67);
this->addChild(levelProgress, 1);
CCSprite *starSprite=CCSprite::createWithSpriteFrameName("exp_star.png");
starSprite->setAnchorPoint(ccp(0, 0));
starSprite->setPosition(ccp(410, wSize.height-195));
this->addChild(starSprite, 1);
//等级
levelLabel=CCLabelTTF::create("2", "MarkerFelt-Thin", 35);
levelLabel->setAnchorPoint(ccp(0, 0));
levelLabel->setPosition(ccp(starSprite->getPosition().x+24, starSprite->getPosition().y+10));
levelLabel->setColor(ccc3(0.5, 0.5, 0.5));
this->addChild(levelLabel,1);
//百分比
levelbfbLabel=CCLabelTTF::create("67%", "MarkerFelt-Thin", 30);
levelbfbLabel->setAnchorPoint(ccp(0, 0));
levelbfbLabel->setPosition(ccp(starSprite->getPosition().x+75, starSprite->getPosition().y+12));
this->addChild(levelbfbLabel,1);
// CCLabelTTF *namebLabel=CCLabelTTF::create("王子大人", "MarkerFelt-Thin", 55);
//
// namebLabel->setAnchorPoint(ccp(0.5, 0.5));
// namebLabel->setPosition(ccp(wSize.width/2,140));
// this->addChild(namebLabel,1);
//开始菜单
CCSprite *startSprite=CCSprite::createWithSpriteFrameName("button_play.png");
CCMenuItemSprite *startItem = CCMenuItemSprite::create(startSprite, startSprite, this, menu_selector(HelloWorld::startGame));
startItem->setPosition(ccp(wSize.width/2,100));
CCMenu* startMenu = CCMenu::create(startItem, NULL);
startMenu->setPosition(CCPointZero);
this->addChild(startMenu, 1);
//能量,满格5个
for (int i=0; i<5; i++)
{
//空的
CCSprite *energySprite=CCSprite::createWithSpriteFrameName("energy_empty.png");
energySprite->setAnchorPoint(ccp(0, 0));
energySprite->setPosition(ccp(55+(3+energySprite->getContentSize().width)*i, wSize.height-288));
this->addChild(energySprite, 1,100+i);
//满的
CCSprite *energySprite2=CCSprite::createWithSpriteFrameName("energy_full.png");
energySprite2->setAnchorPoint(ccp(0, 0));
energySprite2->setPosition(ccp(55+(3+energySprite2->getContentSize().width)*i, wSize.height-288));
this->addChild(energySprite2, 1,200+i);
yeziArray->addObject(CCString::createWithFormat("%d",200+i));
}
//button_share_small.png
//energy_empty.png
//百分比
timeLabel=CCLabelTTF::create("10:00", "MarkerFelt-Thin", 30);
timeLabel->setAnchorPoint(ccp(0, 0));
timeLabel->setPosition(ccp(355, wSize.height-280));
timeLabel->setColor(ccYELLOW);
this->addChild(timeLabel,1);
//购买叶子
CCSprite *addSprite2=CCSprite::createWithSpriteFrameName("add.png");
CCMenuItemSprite *yeziItem = CCMenuItemSprite::create(addSprite2, addSprite2, this, menu_selector(HelloWorld::buyYeZi));
yeziItem->setAnchorPoint(ccp(0, 0));
yeziItem->setPosition(ccp(timeLabel->getPosition().x+timeLabel->getContentSize().width, timeLabel->getPosition().y-18));
CCMenu* yeziMenu = CCMenu::create(yeziItem, NULL);
yeziMenu->setPosition( CCPointZero );
this->addChild(yeziMenu, 1);
//分享背景动画
sharebgSprite=CCSprite::createWithSpriteFrameName("glow.png");
sharebgSprite->setAnchorPoint(ccp(0.5,0.5));
sharebgSprite->setPosition(ccp(yeziItem->getPosition().x+yeziItem->getContentSize().width+42, yeziItem->getPosition().y-18+50));
sharebgSprite->setScale(0.18);
this->addChild(sharebgSprite, 1);
//分享
CCSprite *shareSprite=CCSprite::createWithSpriteFrameName("button_share_small.png");
CCMenuItemSprite *shareItem = CCMenuItemSprite::create(shareSprite, shareSprite, this, menu_selector(HelloWorld::shared));
shareItem->setAnchorPoint(ccp(0, 0));
shareItem->setPosition(ccp(yeziItem->getPosition().x+yeziItem->getContentSize().width, yeziItem->getPosition().y+6));
CCMenu* shareMenu = CCMenu::create(shareItem, NULL);
shareMenu->setPosition( CCPointZero );
this->addChild(shareMenu, 1);
}
//购买宝石
void HelloWorld::addBaoshi()
{
SimpleAudioEngine::sharedEngine()->playEffect("buttonclick.mp3");
}
//购买叶子
void HelloWorld::buyYeZi()
{
SimpleAudioEngine::sharedEngine()->playEffect("buttonclick.mp3");
}
//分享
void HelloWorld::shared()
{
SimpleAudioEngine::sharedEngine()->playEffect("buttonclick.mp3");
}
//开始
void HelloWorld::startGame()
{
if (yeziArray->count()==0)
{
pauselayer->setVisible(true);
return;
}
if (lock==false)
{
lock=true;
SimpleAudioEngine::sharedEngine()->playEffect("buttonclick.mp3");
CCString *numberString=(CCString *)yeziArray->lastObject();
CCSprite *sprite=(CCSprite *)this->getChildByTag(numberString->intValue());
ccBezierConfig bezierConfig;
bezierConfig.controlPoint_1=ccp(sprite->getPosition().x, sprite->getPosition().y);
bezierConfig.controlPoint_2=ccp(wSize.width+200, wSize.height/2);
bezierConfig.endPosition=ccp(wSize.width/2-15,80);
CCBezierTo *bezier=CCBezierTo::create(1.5f, bezierConfig);
CCSequence *seq=CCSequence::create(bezier,CCDelayTime::create(0.5f),CCCallFunc::create(this,callfunc_selector(HelloWorld::removeSprite)),NULL);
sprite->runAction(seq);
}
}
void HelloWorld::removeSprite()
{
CCString *numberString=(CCString *)yeziArray->lastObject();
CCSprite *sprite=(CCSprite *)this->getChildByTag(numberString->intValue());
yeziArray->removeLastObject();
sprite->removeFromParentAndCleanup(true);
lock=false;
dataIndex++;
CCString *infoString=CCString::createWithFormat("%s",this->getSystemTime()->getCString());
//CCLOG("%s",infoString->getCString());
dataArray->addObject(infoString);
phbTableView->reloadData();
// //存储
// CCUserDefault::sharedUserDefault()->setStringForKey(CCString::createWithFormat("data%d",dataIndex)->getCString(), infoString->getCString());
//
// //提交
// CCUserDefault::sharedUserDefault()->flush();
}
//创建暂停界面
void HelloWorld::createPauseLayer()
{
pauselayer=CCLayerColor::create(ccc4(255, 255, 255, 0), 479, 520);
pauselayer->setAnchorPoint(ccp(0, 0));
pauselayer->setPosition(ccp(wSize.width/2-pauselayer->getContentSize().width/2, wSize.height/2-pauselayer->getContentSize().height/2));
this->addChild(pauselayer, 1);
CCSprite *bgSprite=CCSprite::create("bg_pause.png");
bgSprite->setPosition(ccp(pauselayer->getContentSize().width/2, pauselayer->getContentSize().height/2));
pauselayer->addChild(bgSprite);
CCLabelTTF *contentLabel=CCLabelTTF::create("你没有足够的叶子,你可以从叶子商店里购买,或者等几分钟。", "MarkerFelt-Thin",32);
contentLabel->setPosition(ccp(pauselayer->getContentSize().width/2, pauselayer->getContentSize().height/2));
contentLabel->setDimensions(CCSize(pauselayer->getContentSize().width-40,200));
//横向对齐方式
contentLabel->setHorizontalAlignment(kCCTextAlignmentLeft);
contentLabel->setColor(ccWHITE);
pauselayer->addChild(contentLabel);
CCSprite *sureSprite=CCSprite::createWithSpriteFrameName("button_ok.png");
CCMenuItemSprite *sureItem = CCMenuItemSprite::create(sureSprite, sureSprite, this, menu_selector(HelloWorld::pauseButtonPressed));
sureItem->setPosition(ccp(pauselayer->getContentSize().width/2, pauselayer->getContentSize().height/2-160));
CCMenu* sureMenu = CCMenu::create(sureItem, NULL);
sureMenu->setPosition(CCPointZero);
pauselayer->addChild(sureMenu, 1);
pauselayer->setVisible(false);
}
//ok按钮
void HelloWorld::pauseButtonPressed()
{
pauselayer->setVisible(false);
}
上面中,我们进行了界面的布局,没什么复杂的东西,主要是叶子的逻辑及动画,满状态的时候是5片叶子,我们现在点开始,然后就减少一片叶子,并且叶子做一个贝塞尔曲线的动画,当叶子都没有的时候,我们提示一个对话框界面,告诉我们没有叶子了。
效果如下
~~然后是分享后面的背景图旋转动画,
在.h中
void rotateAnimation(void);
在.cpp中定义一个刷新函数 //刷新
this->schedule(schedule_selector(HelloWorld::rotateAnimation), 0.1);
//旋转动画
void HelloWorld::rotateAnimation()
{
rotate=rotate+10;
sharebgSprite->setRotation(rotate);
}
我们设定每隔0.1秒增加10度,当然这个你可以自己设定,然后我们就可以看见分享背景sprite旋转了,(*^__^*) ……
OK,,接下来,我们要加入个排行榜的界面,我们利用cctbaleview,前面的文章中,我已经简单介绍过cctableview了,下面我们直接上代码
在.h中我们增加cctableview的几个虚函数
//CCTableViewDelegate继承自CCScrollViewDelegate
virtual void scrollViewDidScroll(cocos2d::extension::CCScrollView* view);
virtual void scrollViewDidZoom(cocos2d::extension::CCScrollView* view);
//点击哪个cell
virtual void tableCellTouched(cocos2d::extension::CCTableView* table, cocos2d::extension::CCTableViewCell* cell);
//每个cell的size
virtual cocos2d::CCSize cellSizeForTable(cocos2d::extension::CCTableView *table);
//生成cell
virtual cocos2d::extension::CCTableViewCell* tableCellAtIndex(cocos2d::extension::CCTableView *table, unsigned int idx);
//cell的数量
virtual unsigned int numberOfCellsInTableView(cocos2d::extension::CCTableView *table);
然后在.cpp中具体去实现它们
//cell数量
unsigned int HelloWorld::numberOfCellsInTableView(cocos2d::extension::CCTableView *table)
{
return dataArray->count();
}
//每行cell
CCTableViewCell* HelloWorld::tableCellAtIndex(CCTableView *table, unsigned int idx)
{
CCTableViewCell *cell=table->dequeueCell();
if (!cell) {
cell = new CCTableViewCell();
cell->autorelease();
}
cell->removeAllChildrenWithCleanup(true);
//金银铜
if (idx==0)
{
CCSprite *pSprite = CCSprite::createWithSpriteFrameName("rank1.png");
pSprite->setPosition(ccp(40, 60));
cell->addChild(pSprite);
}
else if (idx==1)
{
CCSprite *pSprite = CCSprite::createWithSpriteFrameName("rank2.png");
pSprite->setPosition(ccp(40, 60));
pSprite->setTag(456);
cell->addChild(pSprite);
}
else if (idx==2)
{
CCSprite *pSprite = CCSprite::createWithSpriteFrameName("rank3.png");
pSprite->setPosition(ccp(40, 60));
cell->addChild(pSprite);
}
int touxiangindex=arc4random()%3+1;
CCString *nameString=CCString::createWithFormat("spin%d.png",touxiangindex);
CCSprite *txSprite = CCSprite::createWithSpriteFrameName(nameString->getCString());
txSprite->setPosition(ccp(130, 60));
txSprite->setScale(0.7);
txSprite->setTag(789);
cell->addChild(txSprite);
CCString *fenshu=(CCString *)dataArray->objectAtIndex(idx);
CCLabelTTF *fenshuLabel = CCLabelTTF::create(fenshu->getCString(), "Arial", 36.0);
fenshuLabel->setPosition(ccp(360, 60));
fenshuLabel->setTag(123);
fenshuLabel->setColor(ccYELLOW);
cell->addChild(fenshuLabel);
return cell;
}
CCSize HelloWorld::cellSizeForTable(CCTableView *table)
{
return CCSizeMake(table->getContentSize().width, 120);
}
void HelloWorld::tableCellTouched(CCTableView *table, CCTableViewCell *cell)
{
CCLOG("%d",cell->getIdx());
}
void HelloWorld::scrollViewDidScroll(CCScrollView *view)
{
}
void HelloWorld::scrollViewDidZoom(CCScrollView *view)
{
}
OK,就这么简单,在这里,我们还要获取系统的时间,cocos2dx中获取时间的函数如下
//得到系统时间
CCString* HelloWorld::getSystemTime()
{
struct tm *tm;
#if (CC_TARGET_PLATFORM == CC_PLATFORM_WIN32)
//win32平台
time_t timep;
time(&timep);
tm = localtime(&timep);
#else
//android、ios平台
struct cc_timeval now;
CCTime::gettimeofdayCocos2d(&now, NULL);
tm = localtime(&now.tv_sec);
#endif
int year = tm->tm_year + 1900;
int month = tm->tm_mon + 1;
int day = tm->tm_mday;
int hour=tm->tm_hour;
int min=tm->tm_min;
CCString *string=CCString::createWithFormat("%d-%d-%d %d:%d",year,month,day,hour,min);
return string;
}
OK,,我们看下效果图
OK~~~~~~~~~~~(*^__^*) …… 还有10分钟的倒计时,不知道大家有什么好的方法,我的想法应该是跟系统的时间去关联,这样进入后台或是关闭程序,时间还是继续进行的,通过获取系统的时间,然后某个算法来实现。。。