【iPhoneアプリ開発】テーブルでWeb上の画像を表示

 Tiwtterのクライアントアプリみたいに、TableViewでWeb上にある画像を各セルで表示したい。

しかし、馬鹿正直に「cellForRowAtIndexPath」関数内で「ImageView.image = Web上の画像」なんてやったら
テーブルをスクロールしたタイミングで、新しく表示するセルに描画する画像データを取りに行ってしまうため
なめらかなスクロールどころか、画像を表示する際に画面が固まってしまいます。

そこでテーブルをスクロールしたタイミングで、新しく表示するセルのImageViewにWeb上の画像を描画する処理をスレッドに登録（非同期に）することで、スクロール時に固まらなくなります。

下記サイト様が参考になります。
http://d.hatena.ne.jp/yuum3/20101216/1292490323

私が使用したソースはつづきへ

 
RootViewController.h

@interface RootViewController : UIViewController {

dispatch_queue_t main_queue;

    dispatch_queue_t image_queue;

}

 

- (UIImage *)getImage:(NSString *)url ;

- (NSData *)getData:(NSString *)url;

RootViewController.m

#import "RootViewController.h"

 

@implementation RootViewController

 

 

- (void)viewDidLoad 

{

[super viewDidLoad];

}

 

///////////////////////////////////////////////

//tableview メソッド

 

 

- (NSInteger) tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

{

return 5;

}

 

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

{

[spinner stopAnimating];

spinner.hidden = YES;

static NSString *CellIdentifier = @"Cell";

NSInteger row = [indexPath row]; // tableの行数

 

//Cellの用意

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

cell.selectionStyle = UITableViewCellSelectionStyleNone;

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

 

//ImageViewの用意

UIImageView *photoview;

photoview = [[[UIImageView alloc] initWithFrame: CGRectMake(130.0, 5.0, 100.0, 115.0)] autorelease];

photoview.backgroundColor = [UIColor whiteColor];

[cell.contentView addSubview:photoview];

 

//ImageViewに画像が表示されるまでにインジゲーター（くるくる）を表示

UIActivityIndicatorView *spinner;

spinner = [[[UIActivityIndicatorView alloc] 

  initWithActivityIndicatorStyle: UIActivityIndicatorViewStyleGray]

 autorelease];

spinner.frame = photoview.bounds;

spinner.contentMode = UIViewContentModeCenter;

[spinner startAnimating];

[photoview addSubview: spinner];

//ImageViewにWeb上の画像を表示する処理をスレッドに登録

dispatch_async(image_queue, ^{

UIImage *img = [self getImage:[NSString stringwithformat:@"http://○○○○○○○○.jpg"]];

dispatch_async(main_queue, ^{

photoview.image = img;

indicator.hidden = YES;

 

});

});

return cell;

}

 

///////////////////////////////////////////////

 

 

- (UIImage *)getImage:(NSString *)url {

    return [UIImage imageWithData:[self getData:url]];

}

 

 

- (NSData *)getData:(NSString *)url {

    NSURLRequest *request = [NSURLRequest requestWithURL:

                             [NSURL URLWithString:[url stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding]]

cachePolicy:NSURLRequestUseProtocolCachePolicy timeoutInterval:30.0];

    NSURLResponse *response;

    NSError       *error;

    NSData *result = [NSURLConnection sendSynchronousRequest:request 

                                           returningResponse:&response error:&error];

    if (result == nil) {

        NSLog(@"NSURLConnection error %@", error);

    }

    

    return result;

}