收藏视图图像在滚动时闪烁

Question

我使用下面的代码用图像填充集合视图单元格。

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *identifier = @"Cell";

    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:identifier forIndexPath:indexPath];

    UIImageView *recipeImageView = (UIImageView *)[cell viewWithTag:100];
    recipeImageView.image = nil;
    if ([imageArray count] >0){

        dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_BACKGROUND, 0), ^(void) {
            NSData *data0 = [NSData dataWithContentsOfURL: [NSURL URLWithString:[imageArray objectAtIndex:indexPath.row]]];
            UIImage *image = [UIImage imageWithData: data0];

            dispatch_sync(dispatch_get_main_queue(), ^(void) {
                recipeImageView.image = image;
            });
        });

    }

    [spinnerShow stopAnimating];


    return cell;
}

问题是，当我滚动图像时，图像会闪烁并闪烁。为什么呢？如何使这些图像稳定而不闪烁？

Answer 1

只是一个简短的概述，所以你得到你的答案

UICollectionView 高度优化，因此只在内存中保留屏幕上可见的行。现在，所有行 Cell 都缓存在 Pool 中并被重用而不是重新生成。每当用户滚动 UICollectionView 时，它会将刚刚隐藏的行添加到 Pool 中，并将它们重用于下一个可见行。

那么，现在来回答你的问题

当您滚动 CollectionView 时，collectionView 数据源方法会为每个 indexPath 再次调用，进入可见范围并再次下载您的图像

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath

解决方案

在方法之外实例化一个实例 NSMutableDictionary。

现在在您的代码中

@implementation ClassName{
  NSMutableDictionary *cachedImage;
}

-(void)viewDidLoad(){
  [super viewDidLoad];
  cachedImage = [NSMutableDictionary new];
}

/*OLD CODE*/
UIImageView *recipeImageView = (UIImageView *)[cell viewWithTag:100];
    recipeImageView.image = nil;
 
    if ([imageArray count] >0){

       //IF image is already downloaded, simply use it and don't download it.
       if(cachedImage[[imageArray objectAtIndex:indexPath.row]] != nil){
           recipeImageView.image = cachedImage[[imageArray objectAtIndex:indexPath.row]];
       }
       else{
           dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_BACKGROUND, 0), ^(void) {
               NSData *data0 = [NSData dataWithContentsOfURL: [NSURL URLWithString:[imageArray objectAtIndex:indexPath.row]]];
               UIImage *image = [UIImage imageWithData: data0];

               dispatch_sync(dispatch_get_main_queue(), ^(void) {
                   recipeImageView.image = image;
                   //****SAVE YOUR DOWNLOADED IMAGE 
                   cachedImage[[imageArray objectAtIndex:indexPath.row]] = image; //****SAVE YOUR DOWNLOADED IMAGE 
               });
           });
       }
}        
/*OLD CODE*/

Answer 2

据我所知，您正在获取图像但没有缓存它，这就是为什么当您的 UICollectionViewCell 重新加载时，您会获得 UIImageView 的新实例，所以这件事会在您的代码中不断发生......

在这种情况下，我建议您使用 SDWebImage 或 AFNetworking 框架。因为这些框架用简单的代码行（SDWebImage 框架）为您完成了所有棘手的工作，

NSURL* url = [NSURL URLWithString:str];
[yourImageView setBackgroundImageWithURL:url forState:UIControlStateNormal placeholderImage:kPlaceholder];