cocos2dで、TableViewを実現する方法(CCTableView編)
前回に引き続き、cocos2dでTableViewを実現する方法について記述します。
今回は②の方法です。
現在、cocos2dにはTableViewを実現するモジュールは標準で組み込まれていませんが、CCTableViewSuiteを利用することで、実現が可能です。
初期のCCTableViewはリストを降順に一覧表示するので、昇順に表示できるようになっている、SWTableViewを利用するのが良いと思います。
SWTableViewは、cocos2d形式のオブジェクトで、高速に描画を行え、Transition(画面遷移エフェクト)にも対応していますので、多少手間は掛かりますが、こちらの方法をとったほうが良いと、個人的には思いました。
ただ、デフォルトで使用するとメモリーが開放されない問題があるので、後半でその解決方法を記述します。
まずは、このページからソースをダウンロードさせてもらいます。
ダウンロードしたソースは自分のプロジェクトにコピーして配置しましょう。
使用するときにはまず、Layerのinitで、インスタンスの生成とプロパティのセットを行います。
//myTableはSWTableViewクラスのインスタンスです。 myTable = [SWTableView viewWithDataSource:self size:CGSizeMake(320, 270)]; //一覧のスクロールする方向を指定。以下は縦方向にスクロールします。 myTable.direction = SWScrollViewDirectionVertical; myTable.position = ccp(0,100); //delegateを自分自身のクラスにセットします。 myTable.delegate = self; //一覧を、昇順に並べます。 myTable.verticalFillOrder = SWTableViewFillTopDown; [self addChild:myTable]; [myTable reloadData];
これで、TableViewをLayerに配置できました。ただ、一般的なTableViewと同様、delegteを実装しなければ、タッチしたり、スクロールさせたり、一覧に値をセットすることができませんので、TableViewを配置するLayerクラスに、delegateの宣言を追加します。
@interface MyLayer : CCLayer
これで、上記でセットしたdelegateを、このLayerクラスで処理することができるようになりました。
では、実際にdelegateのメソッドを実装していきます。
cellSizeForTableはテーブルのセルの高さを返します。
-(CGSize)cellSizeForTable:(SWTableView *)table {
return CGSizeMake(320, 104);
}-(SWTableViewCell *)table:(SWTableView *)table cellAtIndex:(NSUInteger)idx はテーブルの各セルが描画されるタイミングで呼ばれるメソッドです。１セル分に描画したい内容を記述します。
-(SWTableViewCell *)table:(SWTableView *)table cellAtIndex:(NSUInteger)idx {
SWTableViewCell *cell = [table dequeueCell];
if (!cell) {
cell = [[AnswerCell new] autorelease];
}
CCSprite *sprite =
[CCSprite spriteWithFile:@"cell.png"];
sprite.position = ccp(60,0);
[cell addChild:sprite];
CCLabelTTF * lblTalentNm1 = [CCLabelTTF labelWithString:@"AAAA" dimensions:CGSizeMake(220, 20) alignment:UITextAlignmentLeft fontName:@"AppleGothic" fontSize:16];
lblTalentNm1.position = ccp(140, 80);
[sprite addChild:lblTalentNm1 z:1];
return cell;
}numberOfCellsInTableView は描画するセルの件数を返します。実際には、描画対象のリストの件数等をcountして返すとよいでしょう。
-(NSUInteger)numberOfCellsInTableView:(SWTableView *)table {
return 20;
}上記でAnswerCellという見慣れないクラスが出てきましたね。これは、自分で定義する１セルを表現するクラスです。名前は自由に付けて大丈夫です。
以下のようなシンプルなクラスを追加で作成しましょう。
AnswerCell.h
#import
#import "SWTableViewCell.h"
#import "SWTableViewSpriteCell.h"
//@class SWTableViewCell;
@interface AnswerCell : SWTableViewCell {
}
//+(CGSize)cellSize;
@end
AnswerCell.m
#import "AnswerCell.h"
@implementation AnswerCell
/**
- (id)init
{
if(! (self = [super init]) )
return nil;
NSLog(@"nothing to see here");
return self;
}
*/
+(CGSize)cellSize {
return CGSizeMake(320, 100);
}
@end
これで、LayerにTableViewを追加することができます。画面遷移の際にもスムーズに動くことが確認できると思います。
だた、スクロールを上下に繰り返していると、だんだんSlowdownしてくることに気が付きませんか？
色々と動かして動きを見ていると、描画後にメモリがreleaseされていないようです。
しかも、スクロールを繰り返して同じセルを描画させると、その度にメモリが割り当てられていきます。
最初は60だったfpuが、最後には10程度にまで落ちてしまいました。
そこで、以下のような記述をSWTableViewに入れることで、速度が遅くなることなく、きれいな描画が可能になりました。参考にしてください。
SWTableViewCell.mへの記述追加(add)
-(void)onExit
{
//これがあると、パフォーマンスが落ちない。(this code is for performance)
[self removeAllChildrenWithCleanup:YES];
}
参考までにSampleProjectを添付します。SWTableViewSample
コラム
cocos2dでゲームを作る際に参考にした本です。初心者用、中級者用とありますので、参考にしてください。私には非常に役立ちましたよ！
cocos2dで作る iPhone＆iPadゲームプログラミングこれは非常にいい本です。画面遷移の基本から応用まで、体系だって解説がなされており、ゲーム作成時に何度も読み返しました。パフォーマンスを考慮したコーディングや物理エンジンについても言及があります。
cocos2d for iPhoneレッスンノートcocos2dを使ってゲームを作るのが初めての人に最適です。いくつかのサンプルのプロジェクトとその解説があり、それをもとに、簡単なゲームは作れるようになるでしょう。初心者がつまづきやすい、AppStoreへの申請方法も例示されています。初めてゲームをリリースするときに参考にしました。
Learning Cocos2D: A Hands-On Guide to Building iOS Games with Cocos2D, Box2D, and Chipmunk cocos2dで物理エンジンを利用したゲームを作る際に参考になります。英語ですが、物理エンジンを解説した本は少ないため、貴重です。
