前回は、実際にRSSを読み込んでパースを行い、その内容をテーブル表示するというアプリケーションの基本的な実装を具体的に解説した。今回は前回の内容を受け、アプリケーションのより詳細な部分の実装に取り掛かろう。
具体的には、テーブルセルの内容をカスタマイズする方法と、セルにタップすると画面が遷移するナビゲーション機能の追加について解説する。ナビゲーションによる画面遷移を追加することで、よりiPhoneらしいアプリケーションを体験してもらえるはずだ。
テーブルセルの変更
テーブルセルとはTableView内の各行要素のことを指し、前回はRSSパーサーで取り出したtitle要素をそのままセルのテキストとして受け渡していた。
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *CellIdentifier = @"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
}
cell.textLabel.text = [[myDataSource objectAtIndex:indexPath.row] title];
return cell;
}
生成直後のコードでは、cellはUITableViewCellクラスのオブジェクトとして定義されている。このままではカスタマイズしづらいので、今回はMyTableViewCellクラスを作成し、セル内に様々な要素を追加していこう。
MytableViewCellクラスの作成
まず新規ファイルとしてUITableViewCellのサブクラスを、MyTableViewCellクラスと名前を付けて作成する(画面1)。
UITableViewCellクラスにはcontentViewというViewが用意されており、contentViewに様々なViewを追加していくことで、セルの見た目をカスタマイズすることが可能となる。そこで、今回はタイトルと日付に加えてアイコン画像を差し込み、セルの外観をカスタマイズしてみよう。
MyTableViewCell.hにはあらかじめメンバー変数として、
UILabel *titleLabel;
UILabel *pubDateLabel;
の2つを追加しておく。
次に、MyTableViewCell.mのinitWithStyleメソッド内で、これらのLabelオブジェクトの生成とcontentViewへの追加を行う。
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
titleLabel = [[UILabel alloc] initWithFrame:
CGRectMake(5, 0, self.contentView.frame.size.width-5, self.contentView.frame.size.height*0.5)];
pubDateLabel = [[UILabel alloc] initWithFrame:
CGRectMake(5, self.contentView.frame.size.height*0.5, self.contentView.frame.size.width-5, self.contentView.frame.size.height*0.5)];
[self.contentView addSubview:titleLabel];
[self.contentView addSubview:pubDateLabel];
}
return self;
}
セルを上下に分けて、上段にtitle、下段にpubDateを表示するようにLabelをcontentViewに追加した。Labelのフレームを作る際に左右のマージンとして5px確保してあるが、ここも自由に変更するとよいだろう。
さて、Labelの作成は終わったが、ここで肝心のテキストをLabelに受け渡す処理が必要となってくる。
前回まではListViewControllerクラスの方で直接cell.textLabel.textにテキストを渡していたが、今回はこのcellはMyTableViewCellクラスのオブジェクトなので、MyTableViewCellクラスの方でsetするメソッドを用意する。
- (void)setLabelText:(Item *)item {
titleLabel.text = item.title;
pubDateLabel.text = item.pubDate;
}
Itemオブジェクトを受け取り、その中のtitle要素とpubDate要素をそれぞれのLabelのtextに渡している。これをListViewControllerの方で呼び出すため、ヘッダー・ファイルに宣言を書いておく。
#import
#import "Item.h"
@interface MyTableViewCell : UITableViewCell {
UILabel *titleLabel;
UILabel *pubDateLabel;
}
- (void)setLabelText:(Item *)item;
@end
#import "MyTableViewCell.h"
@implementation MyTableViewCell
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
titleLabel = [[UILabel alloc] initWithFrame:
CGRectMake(5, 0, self.contentView.frame.size.width-5, self.contentView.frame.size.height*0.5)];
pubDateLabel = [[UILabel alloc] initWithFrame:
CGRectMake(5, self.contentView.frame.size.height*0.5, self.contentView.frame.size.width, self.contentView.frame.size.height*0.5)];
[self.contentView addSubview:titleLabel];
[self.contentView addSubview:pubDateLabel];
}
return self;
}
- (void)setLabelText:(Item *)item {
titleLabel.text = item.title;
pubDateLabel.text = item.pubDate;
}
- (void)setSelected:(BOOL)selected animated:(BOOL)animated {
[super setSelected:selected animated:animated];
// Configure the view for the selected state
}
- (void)dealloc {
[titleLabel release];
[pubDateLabel release];
[super dealloc];
}
MyTableViewCellクラスの実装は以上のようになる。