iOS UITableView中异步加载图片

原文   http://blog.csdn.net/willyang519/article/details/41833293

主题  UITableView

问题背景：

需要在UITableView中的每一行下载图片，之前使用placeholder，下载好后存在cache中。

解决方案：

方案一：

使用SDWebImage：  https://github.com/rs/SDWebImage

如何安装及使用在git页面有详细解释，具体使用的代码：

#import <SDWebImage/UIImageView+WebCache.h>

...

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
  static NSString *MyIdentifier = @"MyIdentifier";

  UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:MyIdentifier];

  if (cell == nil)
  {
    cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault
                     reuseIdentifier:MyIdentifier] autorelease];
  }

  // Here we use the new provided setImageWithURL: method to load the web image
  [cell.imageView setImageWithURL:[NSURL URLWithString:@"http://www.domain.com/path/to/image.jpg"]
           placeholderImage:[UIImage imageNamed:@"placeholder.png"]];

  cell.textLabel.text = @"My Text";
  return cell;
}

方案二：

使用iOS自有的异步多线程，下载好图片后存入cache，再使用delegate函数更新tableview：

- (void)reloadRowsAtIndexPaths:(NSArray *)indexPaths withRowAnimation:(UITableViewRowAnimation)animation

初始化：

@interface ViewController ()

@property (strong, nonatomic)  NSMutableArray *imageArray;
@property (strong, nonatomic) NSCache *imageCache;
@property (weak, nonatomic) IBOutlet UITableView *myCustomTableView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.imageCache = [[NSCache alloc] init];
}

TableView delegate函数：

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
  return 1;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
  // Number of rows is the number of time zones in the region for the specified section.
  return 32;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
  NSLog(@"cellForRowAtIndexPath %d", indexPath.row);
  
  static NSString *MyIdentifier = @"customIdentifier";
  UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:MyIdentifier];
  if (cell == nil) {
    cell = [[CustomTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault  reuseIdentifier:MyIdentifier];
  }
  
  if ([cell isKindOfClass:[CustomTableViewCell class]])
  {
    CustomTableViewCell *customCell = (CustomTableViewCell *)cell;
    NSData *imageData = [self.imageCache objectForKey:[NSString stringWithFormat:@"%d", indexPath.row]];
    
    if(imageData != nil){
      customCell.customImageView.image = [UIImage imageWithData:imageData];
    }
    else{
      customCell.customImageView.image = [UIImage imageNamed:@"test1"];
      
      dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, (unsigned long) NULL), ^(void){
        UIImage *image = [self getPictureFromServer];
        
        if (image != nil) {
          NSData *tmpImageData = UIImagePNGRepresentation(image);
          [self.imageCache setObject:tmpImageData forKey:[NSString stringWithFormat:@"%d", indexPath.row]];
          NSLog(@"download image for %d", indexPath.row);
          
          [self performSelectorOnMainThread:@selector(reloadTableViewDataAtIndexPath:) withObject:indexPath waitUntilDone:NO];
        }
        else{
          // do nothing ..
        }
      });
    }
  }
  else{
    // do nothing ..
  }

  return cell;
}

reloadTableViewDataAtIndexPath：

- (void) reloadTableViewDataAtIndexPath: (NSIndexPath *)indexPath{
  NSLog(@"MyWineViewController: in reload collection view data for index: %d", indexPath.row);

  NSArray* indexArray = [NSArray arrayWithObjects:indexPath, nil];
  [self.myCustomTableView reloadRowsAtIndexPaths:indexArray withRowAnimation:UITableViewRowAnimationFade];
//	[self.myCustomTableView reloadRowsAtIndexPaths:indexArray withRowAnimation:UITableViewRowAnimationAutomatic];
//	[self.myCustomTableView reloadRowsAtIndexPaths:indexArray withRowAnimation:UITableViewRowAnimationBottom];
//	[self.myCustomTableView reloadRowsAtIndexPaths:indexArray withRowAnimation:UITableViewRowAnimationLeft];
//	[self.myCustomTableView reloadRowsAtIndexPaths:indexArray withRowAnimation:UITableViewRowAnimationMiddle];
//	[self.myCustomTableView reloadRowsAtIndexPaths:indexArray withRowAnimation:UITableViewRowAnimationNone];
//	[self.myCustomTableView reloadRowsAtIndexPaths:indexArray withRowAnimation:UITableViewRowAnimationRight];
//	[self.myCustomTableView reloadRowsAtIndexPaths:indexArray withRowAnimation:UITableViewRowAnimationTop];
}

下载图片

- (UIImage *) getPictureFromServer{
  UIImage *image = nil;
  NSString *urlString = [NSString stringWithFormat:@"http://yourPicture<span style="font-family: Arial, Helvetica, sans-serif;">.</span><span style="font-family: Arial, Helvetica, sans-serif;">jpg"];</span>
  
  NSMutableURLRequest *request = [[NSMutableURLRequest alloc] init];
  [request setURL:[NSURL URLWithString:urlString]];
  [request setHTTPMethod:@"GET"];
  
  NSURLResponse *response;
  NSError *connectionError;
  NSData *returnData = [NSURLConnection sendSynchronousRequest:request returningResponse:&response error:&connectionError];

  if (connectionError == NULL) {
    NSInteger statusCode = [(NSHTTPURLResponse *)response statusCode];
    NSLog(@"getPictureFromServer - Response Status code: %ld", (long)statusCode);
    
    if (statusCode == 200) {
      image = [UIImage imageWithData:returnData];
    }
    else{
      // do nothing..
    }
  }
  else{
    // do nothing..
  }
  
  return image;
}

方案三：（不推荐）

在方案二的基础上，变动在于下载好图片后load整个tableview，缺点时会引起滑动tableview时阻塞。

- (void) reloadTableViewData{
    NSLog(@"MyWineViewController: in reload collection view data");
    [self.myCustomTableView reloadData];
}

参考链接：

http://stackoverflow.com/questions/15290974/uitableview-on-screen-image-download-lazy-loading

http://stackoverflow.com/questions/7040740/reload-spefic-uitableview-cell-ios