原创作品,转载请标明:http://blog.csdn.net/jackystudio/article/details/12966993
这节介绍一下游戏中帮助界面和关卡选择的设计,其实都是一样的,关键在于美工。这里采用自定义TableView层来实现。
1.导入头文件和设定空间
因为TableView相关的类是在扩展包里面,所以必须先声明
- #include"cocos-ext.h"
- USING_NS_CC_EXT;
2.继承的实现
自定义TableView继承于CCLayer,因此可以捕获触摸,同时继承于扩展包的CCTableViewDataSource和CCTableViewDelegate。前者是TableView的数据源,包含了一系列和TableView数据单元相关的操作,后者则是继承于CCScrollViewDelegate抽象类,声明了一些和滚动,放大,触摸回调之类的接口,然后在内部包含了一个CCTableView,这用起来有点像Android的Adapter。当然分别继承几个类使用也是一样的。
先看一下要实现的接口吧。
- classTableViewTestLayer:publiccocos2d::CCLayer,publiccocos2d::extension::CCTableViewDataSource,publiccocos2d::extension::CCTableViewDelegate
- {
- public:
- virtualboolinit();
- CREATE_FUNC(TableViewTestLayer);
- virtualvoidscrollViewDidScroll(cocos2d::extension::CCScrollView*view){}//滚动时调用,空实现,因为继承了抽象类所以必须重写
- virtualvoidscrollViewDidZoom(cocos2d::extension::CCScrollView*view){}//缩放时调用,空实现,同上
- virtualvoidtableCellTouched(cocos2d::extension::CCTableView*table,cocos2d::extension::CCTableViewCell*cell);//触摸单元时回调
- virtualcocos2d::CCSizetableCellSizeForIndex(cocos2d::extension::CCTableView*table,unsignedintidx);//设定单元所占大小
- virtualcocos2d::extension::CCTableViewCell*tableCellAtIndex(cocos2d::extension::CCTableView*table,unsignedintidx);//设定单元内容
- virtualunsignedintnumberOfCellsInTableView(cocos2d::extension::CCTableView*table);//返回单元数
- };
3.自定义TabView层各模块的实现
3.1.初始化函数init
- CCSizewinSize=CCDirector::sharedDirector()->getWinSize();
- CCTableView*tableView=CCTableView::create(this,winSize);//创建一个CCTableView
- tableView->setDirection(kCCScrollViewDirectionHorizontal);//设置方向
- tableView->setPosition(ccp(0,winSize.height/2-50));
- tableView->setDelegate(this);//这句话很重要,把taleView和当前类绑到一起,所以后面的调用主体都是tableView
- this->addChild(tableView);
- tableView->reloadData();
3.2.触摸回调tableCellTouched
- voidTableViewTestLayer::tableCellTouched(CCTableView*table,CCTableViewCell*cell)
- {
- CCLOG("celltouchedatindex:%i",cell->getIdx());//cell为当前选择单元
- }
3.3.单元大小tableCellSizeForIndex
- CCSizeTableViewTestLayer::tableCellSizeForIndex(CCTableView*table,unsignedintidx)
- {
- //if(idx==2){
- //returnCCSizeMake(100,100);//第2个大小为100,100
- //}
- returnCCSizeMake(120,120);其余为120,120
- }
3.4.设置数据源tableCellAtIndex
- CCTableViewCell*TableViewTestLayer::tableCellAtIndex(CCTableView*table,unsignedintidx)
- {
- CCString*string=CCString::createWithFormat("%d",idx);
- CCTableViewCell*cell=table->dequeueCell();
- if(!cell){
- cell=newCCTableViewCell();//创建单元,如果要自定义单元效果,需继承CCTableViewCell,并重载draw函数
- cell->autorelease();
- CCSprite*sprite=CCSprite::create("HelloWorld.png");
- sprite->setScale(0.2f);
- sprite->setPosition(ccp(60,60));
- sprite->setTag(123);
- cell->addChild(sprite);//添加到cell
- CCLabelTTF*label=CCLabelTTF::create(string->getCString(),"Helvetica",20.0);
- label->setPosition(ccp(60,10));
- label->setTag(456);
- cell->addChild(label);//添加到cell
- }
- else
- {
- CCLabelTTF*label=(CCLabelTTF*)cell->getChildByTag(456);
- label->setString(string->getCString());
- }
- returncell;
- }
3.5.单元数numberOfCellsInTableView
- unsignedintTableViewTestLayer::numberOfCellsInTableView(CCTableView*table)
- {
- return20;//直接返回设定单元数
- }
4.效果图