异步图像加载的 UICollectionView dequeueReusableCellWithReuseIdentifier 问题

Question

所以问题很简单。我想制作一个类似 Instagram 的屏幕，用户可以在从底部向上滚动的同时无限地查看图像。

我已经成功地在用户到达底部时下载了下一页的图像。我在我的 cellForItemAtIndexPath 中使用 dequeueReusableCellWithReuseIdentifier，我正在使用 AsyncImageView Library.

异步下载图像

问题是 - 滚动 up/down 时，单元格中的图像变得 on/off。意味着首先单元格显示旧图像，然后在异步下载后显示新图像。我想要像 Instagram 这样的平滑效果，其中新单元格作为空白单元格附加在底部，然后加载图像。

这是我的代码。

viewWillAppear

第一名

[self.photosCollectionView registerNib:[UINib nibWithNibName:kPhotoCell bundle:nil] forCellWithReuseIdentifier:kCollectionViewCellId];

然后

-(UICollectionViewCell *)collectionView:(UICollectionView *)paramCollView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    UICollectionViewCell *cell = [paramCollView dequeueReusableCellWithReuseIdentifier:kCellectionViewCellId forIndexPath:indexPath];
    PhotoBO *singlePhoto = [self.photosArray objectAtIndex:indexPath.row];
    [((AsyncImageView *)[cell viewWithTag:10]) setImageURL:[PhotoBL getPhotoURL:singlePhoto]];
    return cell;
}

总结一下，请在模拟器中watch this video of my app运行

Answer 1

你可以这样做：

只能在NSDefaultRunLoopMode下下载图片，因为滚动collection view时，runloop模式会在UITrackingRunLoopMode中设置。
缓存您下载的图片。
重复使用电池时清洁它。

Answer 2

所以我最终得到了以下解决方案

从我的代码中删除了 AsyncImageView 库。
引入 AFNetworking 用于网络调用和异步图像下载。
在cellForItemAtIndexPath方法中，在设置新图像之前将细胞图像设置为nil
使用UIImageView+AFNetworking的以下方法下载了cellForItemAtIndexPath

-(void)setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholderImage;

现在一切都很好。我实现了流畅的滚动效果，图片问题on/off也解决了

Answer 3

SDWebImage 是更好的库来获得你想要的东西。它具有下载和缓存功能，效果很好。开箱即用，易于集成。

或者，您可以使用 FastImageCache + AFNetworking 来获得 UI 的最佳性能和 FPS。这将需要更多的代码，但结果令人印象深刻。你真的应该看看它。

异步图像加载的 UICollectionView dequeueReusableCellWithReuseIdentifier 问题

UICollectionView dequeueReusableCellWithReuseIdentifier issue with Async Image Loading

asynchronous

objective-c

ios

uicollectionview