iPhoneアプリ開発Tips 003 – TableViewCellの標準スタイル

Posted on 2010-03-17 14:42:45 in iPhone Dev written by staff

こんにちは、アプリ開発担当のmaryaです。
今回も引き続き、UITableViewに関するTipsとなります。

UIKitには、iPhone OS 3.0 から導入されたTable Viewが行を表示するために使用するTable View Cellの4つのスタイルがあります。

4つのスタイルは
・ UITableViewCellStyleDefault
・ UITableViewCellStyleSubtitle
・ UITableViewCellStyleValue1
・ UITableViewCellStyleValue2
という定数で定義されいていて、例えば以下のような形式で使用します。

static NSString *CellIdentifier = @”Cell”;

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
}

// Configure the cell.
cell.textLabel.text = [cellTitleArray objectAtIndex:indexPath.row];
cell.detailTextLabel.text = [cellSubtitleArray objectAtIndex:indexPath.row];
cell.imageView.image = [UIImage imageNamed:[cellImagesArray objectAtIndex:indexPath.row]];

では、この4つのスタイルでそれぞれどのようなTable View Cellを表現できるのかを見ていきたいと思います。

(1). UITableViewCellStyleDefault

デフォルトのテーブル行スタイル

(2). UITableViewCellStyleSubtitle

タイトルの下にサブタイトルを持つテーブル行スタイル

(3). UITableViewCellStyleValue1

右揃えのサブタイトルを持つテーブル行スタイル

(4). UITableViewCellStyleValue2

「連絡先(Contacts)」形式のテーブル行スタイル

このようにiPhone OS 3.0以降では、標準機能としてTable View Cellのスタイルを変更できるようになり、開発者は状況に応じたインタフェースを提供できるようになっています。
また、必要であれば外観が異なるカスタムTable View Cellを作成することもでき、i暗記でもそちらのカスタムセルの方を利用していますが、 今回紹介させて頂いた標準の4つのセルスタイルを利用するだけでもほとんどの場合目的にかなうと思います。

前回紹介させて頂いた「編集モード」や、今回の「TableViewCellの標準スタイル」を使いこなせれば
Table Viewの見た目の部分に関してはほぼ完成できると思いますので、
次回はTable Viewを利用した画面遷移の紹介をさせて頂きます。


comments: 0 »

iPhoneアプリ開発Tips 002 – UITableViewの編集モードでできること

Posted on 2010-02-17 17:06:38 in iPhone Dev written by staff

こんにちは、アプリ開発担当のmaryaです。
今回も引き続き、UITableViewに関するTipsとなります。

さて、i暗記にも使用しており非常に便利なTableViewですが、このTableViewには通常モードのほかに、編集モードがあります。TableViewが編集モードに入ると2種類のコントロール、
– 編集用コントロール
– 並べ替えコントロール
が表示されます。ユーザはこれを利用してTableViewの行を挿入したり削除したり、任意の位置に並べ替えたりできます。

それでは、その手順を順を追って見ていきたいと思います。

Click here to read more.. »


comments: 0 »

iPhoneアプリ開発Tips 001 – UITableViewのメソッド実行順について

Posted on 2010-01-20 13:37:48 in iPhone Dev written by staff

初めまして。i暗記チームでiPhoneアプリ側の開発を担当しているmaryaです。

今日は、i暗記でも多くの画面で使われているUITableViewを実装していくときに、
最初に知っておくべきだと思った点について書きます。

UITableViewは、セクションやセルの設定などを行う必要がありますが、
それらを設定するメソッドはこちら側で明示的に呼び出さなくても、内部で実行してくれます。

逆に捉えると、勝手に実行されます。
従って、それらのメソッドが実行される順番を把握しておくことは様々な操作をしていく上で重要なことになります。

例えば、以下のソースを実行すると実行結果は下図のようになります。

#pragma mark Table view methods

// 各セルの高さを決定する
– (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
NSLog(@”heightForRowAtIndexPath”);
return 44.0;
}

// 各セクションのタイトルを決定する
– (NSString *)tableView:(UITableView *)tv titleForHeaderInSection:(NSInteger)section {
NSLog(@”titleForHeaderInSection”);
NSString *str = @”title”;
return str;
}

// テーブルに含まれるセクション数を決定する
– (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
NSLog(@”numberOfSectionsInTableView”);
return 1;
}

// 各セクションに含まれるセル数を決定する
– (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
NSLog(@”numberOfRowsInSection”);
return 1;
}

// 各セルの表示内容を決定する
– (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
NSLog(@”cellForRowAtIndexPath”);
static NSString *CellIdentifier = @”Cell”;

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
}

// Configure the cell.

return cell;
}

iPhoneアプリ開発参考画像001
図1:実行結果

このように、iPhoneアプリ開発ではiPhoneを傾けたり、スクロールしたりといった
動作とともに呼ばれるメソッド等、内部で呼び出されるメソッドの実行順序をきちんと把握していることがとても重要なポイントとなります。

UITableViewを使うときは、この他にもパフォーマンス面などにも注意して実装する必要がありますが、
上手く使いこなせれば様々なアプリにUITableViewを自由に組み込むことが可能になります。

これからもこのようなTipsをいろいろと紹介していきたいと思いますので、よろしくお願いします。


comments: 0 »