ぜん通。

<ぜんつう>ネトゲとかソシャゲとか、雑記。

   

【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;
}
 

拍手[1回]

COMMENT

NAME
TITLE
MAIL(非公開)
URL
EMOJI
Vodafone絵文字 i-mode絵文字 Ezweb絵文字
COMMENT
PASS(コメント編集に必須です)
SECRET
管理人のみ閲覧できます

No Title

  • by ゆう
  • 2012/07/05(Thu)22:42
  • Edit
セルに画像を表示させる方法が分からず、途方に暮れている際にこのサイトを見つけました。

本当に助かりました。ありがとうございます。

是非より詳しく勉強させて頂きたいのですが、サンプルプロジェクトを頂くことは出来ませんでしょうか。

よろしくお願いします。

Re:No Title

  • by Zenchuu
  • 2012/07/06 10:15
このぐらいの処理ならiPhone Dev Centerのサンプルにあったと思いますよー。

TRACKBACK

Trackback URL:

カウンター

マジモン窓

プロフィール

HN:
Zenchuu
性別:
男性
職業:
えんじにあ
自己紹介:
いわゆるオタク系。
HNのzenchuuは子供のころからのあだ名。
iPhoneアプリの制作〜運用を仕事にしてます。
人間強度は最高レベルだと自負。
友達?要らねーよヽ(´ー`)ノ

Twitter

いろいろ

Copyright ©  -- ぜん通。 --  All Rights Reserved
Design by CriCri / Photo by Geralt / powered by NINJA TOOLS /  /