読者です 読者をやめる 読者になる 読者になる

UITableViewの基礎的な使い方

最近、UITableViewはなんとなく触れる用になってきたので、基礎的な使い方をまとめます。

とりあえず表示してみる

とりあえず画面にtableViewを表示します。

UITableView *tableView = [[UITableView alloc]initWithFrame:self.view.bounds style:UITableViewStylePlain];
[self.view addSubview:tableView];

立ち上げてみるとこんな感じです。中身が何も入っていないので非常に見づらいです。

f:id:w6500:20131119225453p:plain:w300

データを表示してみる

UITableViewにデータを表示するためには、UITableViewDelegateとUITableViewDataSourceをdelegateしなくてはなりません。
まずは、delegateする対象のクラスを指定します。

tableView.delegate = self;
tableView.dataSource = self;

さらに対象となるクラスには、delegate元のクラスを宣言しなければなりません。

@interface HogeViewController ()<UITableViewDelegate, UITableViewDataSource>
@end

delegateメソッドを実装する

delegateメソッドには様々なものがありますが、最低限設定しなければいけないものを下記にまとめます。

TableViewのセクションの数を返す

このメソッドは、TableViewの中にセクションがいくつあるのかを数値で返します。
今回は固定で5つのセクションを作ってみます。

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return 5;
}
TableViewのセクション名を返す

このメソッドは、セクションのタイトルを返します。
引数で渡ってくるsectionは、幾つ目のセクションなのかを判別するためのIntegerが渡されるため、その値に応じて返す値を振り分けます。

- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section
{
    return [NSString stringWithFormat:@"section%ld", (long)section];
}
1つのセクションに含まれるrowの数を返す

このメソッドは、1つのセクションの中にいくつcellがあるのかを数値で返します。
引数で渡ってくるsectionは、幾つ目のセクションなのかを判別するためのIntegerが渡されるため、その値に応じて返す値を振り分けます。
今回は固定で10を指定します。

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 10;
}
sectionとrowの関係

f:id:w6500:20131119231444p:plain:w300

1つ1つのセルを返す

このメソッドは、1つ1つのセルデータを返します。
引数に渡ってくるindexPathからは、indexPath.section(どのセクションかを表す数値)とindexPath.row(どの行数目かを表す数値)が取得できるため、その値に応じてセルに表示するためのデータ等を設定します。

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    // "cell"というkeyでcellデータを取得
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];
    // cellデータが無い場合、UITableViewCellを生成して、"cell"というkeyでキャッシュする
    if (!cell) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cell"];
    }
    cell.textLabel.text = @"hoge";
    
    return cell;
}

また、セルを表示しようとする度に、いちいちセルのインスタンスを作っていると処理が重くなってしまうので、一番最初に生成した後は、keyを指定して再利用できるようにキャッシュしています。

この状態でアプリを立ち上げてみると、このようになります。

f:id:w6500:20131119234038p:plain:w300

セクションに「section*」と表示され、各セクションの中には10個のcellが表示されています。

セルがタップされたイベントをキャッチする

これだけだと、ただTableViewを表示しただけになってしまうので、下記のメソッドで、タップされた時の処理を実装します。(例えばViewControllerを切り替えるなど)

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    // cellがタップされた際の処理
}

まとめ

簡単なTableViewだったらこれで大体実装できると思います。
まだまだ他にもdelegateメソッドはいっぱいあるので、それぞれどういう働きをするのか試してみたいです。