やはり連休は楽しい、こうやって夜遅くまでコーディングができる。
ここ2-3ヶ月TableViewの勉強をしていたのだが、あまりはかどらなかった。
もちろん絶対的に時間がなかったのだが、あまりよい教材もなかったのだ。
それは意外なところから見つかった、そう公式のライブラリである。
iOS Table Viewプログラミングガイド
今日はこれをもとに、編集モード付のTableViewを作る。
スケルトンプロジェクトを作成
Navigation-based Applicationで、名前は"TableViewEX"
メンバ変数を追加
"RootViewController.h"にNSInteger numOfCellsをメンバ変数として追加する。
セクション数と行数を設定
ここで有効なセクションの行数を"numOfCell + 1"としているのは、新規行の追加するための行を表示するためである。
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
return 1;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
if ( section == 0 ) return numOfCells + 1;
else return 0;
}
各セルの表示
これで"numOfCells"数だけ、(セクション番号)-(行番号)が表示される。
- (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];
}// Configure the cell.
if ( indexPath.section == 0 )
{
if ( indexPath.row < numOfCells )
{
cell.textLabel.text = [ NSString stringWithFormat: @"%d-%d", indexPath.section, indexPath.row ];
}
else
{
cell.textLabel.text = [ NSString stringWithFormat: @"" ];
}
}
return cell;
}
viewDidLoadに
としてビルドすれば、動くはずである。
numOfCells = 5;
編集ボタンの表示
viewDidLoadを以下の様に変更する。
オーバーライドしているメソッドの2行目で、Navigation Barの右上に"編集"ボタンを表示する。
- (void)viewDidLoad
{
[super viewDidLoad];
self.navigationItem.rightBarButtonItem = self.editButtonItem;
numOfCells = 5;
}
削除/挿入ボタンの表示
スケルトンに、editingStyleForRowAtIndexPathのオーバーライドを追加
これを入れておかないと、編集モードに入ったときにアクティブなセル(セクション数と行数で設定されているセル)に全て削除ボタンが表示される。
- (UITableViewCellEditingStyle) tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath
{
if ( indexPath.row == numOfCells ) return UITableViewCellEditingStyleInsert;
else return UITableViewCellEditingStyleDelete;
}
上記のようにすることで、numOfCells分の行は削除ボタン、一番下の行には挿入ボタンが表示される。
削除/挿入の処理
commitEditingStyleを以下のように変更する。
ここで重要なのは、例えテストのためでも、行を挿入/削除する処理を追加しておくこと。
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath
{
if (editingStyle == UITableViewCellEditingStyleDelete)
{
// Delete the row from the data source.
numOfCells--;
[tableView deleteRowsAtIndexPaths:[NSArray arrayWithObject:indexPath] withRowAnimation:UITableViewRowAnimationFade];
[ self.tableView reloadData ];
}
else if (editingStyle == UITableViewCellEditingStyleInsert)
{
// Create a new instance of the appropriate class, insert it into the array, and add a new row to the table view.
numOfCells++;
[ self.tableView reloadData ];
}
}
でないと、appがクラッシュする。
さて、これで一応動作はするのだが、次への予習も兼ねて行の表示スタイルを変更する。
cellForRowAtIndexPathを以下のようにする。
あら不思議、一行に2行表示できるようになった!
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = @"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:CellIdentifier] autorelease];
}// Configure the cell.
if ( indexPath.section == 0 )
{
if ( indexPath.row < numOfCells )
{
cell.textLabel.text = [ NSString stringWithFormat: @"%d-%d", indexPath.section, indexPath.row ];
cell.detailTextLabel.text = @"nobu_macsuzuki";
}
else
{
cell.textLabel.text = [ NSString stringWithFormat: @"" ];
cell.detailTextLabel.text = [ NSString stringWithFormat: @"" ];
}
}
return cell;
}