在uitableviewcell中异步加载图像 [英] Asynchronously load image in uitableviewcell

问题描述

我正在尝试异步加载 UITableVIew 中的图像。

I am trying to asynchronously load an image in a UITableVIew.

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

UITableViewCell *cell = nil;
NSString *cellIndetify = [NSString stringWithFormat:@"cell%d",tableView.tag -TABLEVIEWTAG];

cell = [tableView dequeueReusableCellWithIdentifier:cellIndetify];
IndexPath *_indextPath = [IndexPath initWithRow:indexPath.row  withColumn:tableView.tag - TABLEVIEWTAG];
if (cell == nil) {

    cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIndetify];
    cell.selectionStyle = UITableViewCellSelectionStyleNone;
    cell.contentView.backgroundColor = [UIColor blackColor];
// here I init cell image view
        UIView *cellSub =  [self.waterFlowViewDatasource waterFlowView:self cellForRowAtIndexPath:_indextPath];

    cellSub.backgroundColor = [UIColor blackColor];
    [cell.contentView addSubview:cellSub];
    cellSub.tag = CELLSUBVIEWTAG;

}
// fill image info 
    [self.waterFlowViewDatasource waterFlowView:self fillDataIntoCellSubview:[cell viewWithTag:CELLSUBVIEWTAG] withIndexPath:_indextPath];


CGFloat cellHeight = [self.waterFlowViewDelegate waterFlowView:self heightForRowAtIndexPath:_indextPath];

CGRect cellRect = CGRectMake(0, 0, _cellWidth, cellHeight);
[[cell viewWithTag:CELLSUBVIEWTAG] setFrame:cellRect];


[self.waterFlowViewDatasource waterFlowView:self relayoutCellSubview:[cell viewWithTag:CELLSUBVIEWTAG] withIndexPath:_indextPath];

return cell;
}

在 ImageView class I init：

in that ImageView class I init:

(id)initWithIdentifier:(NSString *)indentifier
{
    if(self = [super initWithIdentifier:indentifier])
    {
        self.backgroundColor = [UIColor blackColor];

        if (!self.imageView) {
            _imageView = [[UIImageView alloc] init];
            self.imageView.backgroundColor = IMAGEVIEWBG;
            [self addSubview:self.imageView];

            self.imageView.layer.borderWidth = 1;
            self.imageView.layer.borderColor = [[UIColor colorWithRed:0.85 green:0.85 blue:0.85 alpha:1.0] CGColor];
        }
        ......some others controllers
}

-(void)setImageWithURL:(NSURL *)imageUrl{


    UIImage *cachedImage = [[SDImageCache sharedImageCache] imageFromKey:[imageUrl absoluteString]];
    if (cachedImage) {
        self.imageView.image = cachedImage;
    }else{
        SDWebImageManager *manager = [SDWebImageManager sharedManager];
            [manager downloadWithURL:imageUrl delegate:self options:SDWebImageCacheMemoryOnly userInfo:[[NSDictionary alloc] initWithObjectsAndKeys:[imageUrl absoluteString], @"image_url", [NSValue valueWithBytes:&imageSize objCType:@encode(CGSize)], @"image_size", [NSNumber numberWithInt:arrIndex], @"imageview_index", nil]];
            _imageView.image = [UIImage imageNamed:@"album_detail_placeholder.png"];
}
.....
.....

- (void)imageDecoder:(SDWebImageDecoder *)decoder didFinishDecodingImage:(UIImage *)image userInfo:(NSDictionary *)userInfo {

       imageView.image = image
}

如你所见，我使用了SDWebImageManager，但这似乎不是问题。

As you see here I used SDWebImageManager, but that doesn't seem to be the problem.

当下一页的图像出现在下一页的图像之前已加载，如果我滚动回上一页的加载图像，图像将被另一个图像覆盖（应显示在最新页面，而不是当前页面...）（例如，在第一页，我有一个图像，此图像中有猫，然后我向下滚动直到请求下一页，并在获取所有下一页图像的URL后，启动异步线程下载图像，在下载最新图像之前，滚动回到顶部，可能首先一段时间后，下载了一些图像，它们应该显示在那里，但现在图像将覆盖当前的p年龄图像，也许猫图像现在有一个狗图像）我该怎么办？

When pull up to next page, before the next page's images have loaded, if I scroll back to previous page's loaded image, the image will be covered by another image (which is should display in the newest page, not current page...) (for example, in the first page, I have a image and there is cat in this image, and then I scroll down till pull up to request next page, and after get all next page image's url, start asynchronous thread download images, before the newest images downloaded, scroll back to top, maybe first page. After awhile, some images downloaded, they should display in there cell, but now the images will cover the current page images, maybe the cat image now have a dog image on it) what shall I do?

推荐答案

当一行滚动时在屏幕外，表格视图将该行的单元格重新用于已在屏幕上滚动的另一行。

When a row is scrolled off-screen, the table view reuses that row's cell for another row that has scrolled on-screen.

问题是您使用的是 ImageView 作为后台加载程序的委托， ImageView 与单元格相关联，而不是与行相关联。当后台加载程序完成加载图像时，该单元格可能已被重用于另一行。

The problem is that you are using the ImageView as the delegate of the background loader, and the ImageView is associated with a cell, not a row. By the time the background loader finishes loading the image, the cell may have been reused for another row.

您需要使表格视图的数据源成为该委托的委托。背景图像装载机。当它调用 downloadWithURL：delegate：options：userInfo：时，它应该将行的索引路径放入 userInfo 字典中。 。当下载程序将 imageDecoder：didFinishDecodingImage：userInfo：发送到数据源时，数据源应该从 userInfo 并使用它来询问当前显示该行的单元格的表格视图（通过向表格视图发送 cellForRowAtIndexPath：）。

You need to make the table view's data source be the delegate for the background image loader. It should put the index path of the row into the userInfo dictionary when it calls downloadWithURL:delegate:options:userInfo:. When the downloader sends imageDecoder:didFinishDecodingImage:userInfo: to the data source, the data source should get the index path out of the userInfo and use it to ask the table view for the cell currently displaying that row (by sending cellForRowAtIndexPath: to the table view).

这篇关于在uitableviewcell中异步加载图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！