UITableView のセルに画像を表示する : Objective-C プログラミング

PROGRAM


UITableView のセルに画像を表示する

UITableView のセル (UITableViewCell) は、画像を簡単に表示できるようになっています。

UITableViewCell の imageView プロパティに画像を設定すると、その画像が textLabel の左側に挿入されます。

 

UITableViewCell の内容の準備は、UITableViewController を Xcode 4 で作成した時に、その "tableView:cellForRowAtIndexPath:" メソッド内で行えるように用意されるので、そこで次のようにして、画像ファイルを設定する感じになります。

なお、以下のコードは ARC (Automatic Reference Counting) を前提に記載していますので、ARC が有効でない場合には retain や release などを適切なタイミングで実行するようにする必要があります。

// セルの生成が必要な際に、UITableViewController が呼び出すメソッドです。

- (UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)

{

// ここで、カスタムセルのレイアウト時に設定した Reuse Identifier を指定します。

static NSString* CellIdentifier = @"Cell";

 

UITableViewCell* cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

 

if (cell == nil)

{

cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];

}

 

// セルのプロパティを設定します。

cell.textLabel.text = @"TEST";

cell.imageView.image = [UIImage imageNamed:@"EzPlayButton.png"];

 

// 準備したセルを返します。

return cell;

}

このような感じで、プロジェクトにバンドルした画像ファイル名を指定して、画像を作成します。

その画像を、UITableViewCell の imageView に設定すれば、セルの左側に画像イメージが表示されるようになりました。

画像を表示させたときには、textLabel に設定したテキストが重ならないように、ちゃんと横にずれて表示されるので簡単です。

なお、今回のように同じ画像を何度も使用する場合には、今回お話したような "imageNamed:" メソッドによる UIImage 画像作成の方が、名前毎に 1 箇所にキャッシュされるらしいので向いていますが、ひとつひとつ違う画像を表示するような場合には向いていないらしいです。

毎回作り直すなど、キャッシュする必要のない画像の場合には、UIImage 画像作成の際に、一度 NSData クラスの "initWithContentsOfURL:" で画像データを読み込んで、それを UIImage の "initWithContentsOfURL:" メソッドを使用して画像を生成して、使い終わったらリリースするのが良いようです。

[ もどる ]