UICollectionViewController在滾動上重新加載圖像

Question

我使用ParseFramework來獲取一些圖像並將它們顯示在一個collectionViewController中。事情是，如果在所有圖像加載之前滾動，我會遇到圖像重複，因此我在不同的單元格中找到相同的圖像。以下是可幫助您的代碼片段。

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

    ExampleCell *cell = (ExampleCell*)[collectionView dequeueReusableCellWithReuseIdentifier:@"imageCell" forIndexPath:indexPath]; 

    PFObject * imageObject = [self.imageFilesArray objectAtIndex:indexPath.row]; 

    PFFile * imageFile=[imageObject objectForKey:@"image"]; 

    [imageFile getDataInBackgroundWithBlock:^(NSData *data, NSError *error) { 
     if(!error){ 
      cell.parseImage.image=[UIImage imageWithData:data]; 
     } 
    }]; 
    return cell; 
} 

，這就是執行查詢的方法：

-(void) queryParseMethod{ 

    PFQuery *query = [PFQuery queryWithClassName:@"Allimages"]; 
    [query findObjectsInBackgroundWithBlock:^(NSArray * objects, NSError *error) { 
     if(!error){ 
      self.imageFilesArray = [[NSArray alloc] initWithArray:objects]; 
      [self.collectionView reloadData]; 
     } 
    }]; 
} 

這是ExampleCell.h

@property (weak, nonatomic) IBOutlet UIImageView *parseImage; 

這是ExampleCell.m

@synthesize parseImage; 

在故事板我正在設定標識該細胞的細胞至imageCell。

我認爲下面的答案，所以我修改了我的方法：

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath 
{ 
    ExampleCell *cell = (ExampleCell*)[collectionView dequeueReusableCellWithReuseIdentifier:@"imageCell" forIndexPath:indexPath]; 

if(cell==nil) // no queued cell to dequeue 
{ 
    cell = (ExampleCell *)[[UICollectionViewCell alloc] initWithFrame:CGRectMake(0,0,50,50)]; 
} 

// clear any previous image if necessary 
cell.parseImage.image = nil; 

PFObject * imageObject = [self.imageFilesArray objectAtIndex:indexPath.row]; 
PFFile * imageFile=[imageObject objectForKey:@"image"]; 

[imageFile getDataInBackgroundWithBlock:^(NSData *data, NSError *error) 
{ 
    if(!error) 
     cell.parseImage.image=[UIImage imageWithData:data]; 
}]; 

return cell; 

}

但我仍然有同樣的問題。我做錯了什麼？

Answer 1

所以經過大量的調查我發現了問題存在於getDataInBackground..So以來的getData是工作：

所以，當你出列的單元格，你應該通過清除以前的圖像開始對於我來說，不要將圖像與索引混淆，我決定同時使用getData和getDataInBackground來達到我的目的。我使用getDataInBackground從PFFile中獲取數據，但不顯示它在單元格中。當數據可用時，我將使用getData檢索它。

下面的代碼裏面cellForItemAtIndexPath：

//PFCell is the same as ExampleCell previously but of type PFCollectionViewCell  
PFCell * cell = (PFCell*) [collectionView dequeueReusableCellWithReuseIdentifier:@"imageCell" forIndexPath:indexPath]; 


PFObject * imageObject = [self.imageFilesArray objectAtIndex:indexPath.row]; 
PFFile * imageFile=[imageObject objectForKey:@"image"]; 


cell.parseImage.image=nil; 

//Getting the data from the PFFile placing it in memory 
[imageFile getDataInBackgroundWithBlock:^(NSData *data, NSError *error) 
{}]; 

dispatch_async(dispatch_get_main_queue(), ^{ 
    //If the data is now available in memory 
    if(imageFile.isDataAvailable){ 
     cell.parseImage.image=[UIImage imageWithData:[imageFile getData]]; 
     cell.activityIndicator.hidden=YES; 
    } 
    //I added an activity Indicator in case there’s no image yet 
    else{ 
     [cell.activityIndicator startAnimating]; 
     cell.activityIndicator.hidden=NO; 
    } 
}); 

return cell; 

現在肯定有這個缺點。圖像不會加載，除非用戶滾動，所以方法將被再次調用，所以getData。

所以我不得不添加在viewDidLoad中的計時器：

[NSTimer scheduledTimerWithTimeInterval:5.0f 
           target:self selector:@selector(reloadData) userInfo:nil repeats:YES]; 

而且功能：

-(void) reloadData{ 
NSArray * cellsToReload=[[NSArray alloc] init]; 
NSMutableArray * temp=[[NSMutableArray alloc] init]; 
for(int i=0;i<[[self.collectionView visibleCells] count];i++){ 

    PFCell * cell=(PFCell*)[self.collectionView visibleCells][i]; 
    if(cell.parseImage.image==nil){ 
     [temp addObject:[self.collectionView indexPathForCell:cell]]; 
    } 

} 

cellsToReload=[temp copy]; 
[self.collectionView reloadItemsAtIndexPaths:cellsToReload]; 

}

我不得不做這一切都是因爲一個簡單的[self.collectionView reloadData]會每5秒閃爍一次視圖。

Answer 2

我認爲你有重複的圖像，因爲有些單元格被重用。

當一個單元格不再可見時，它被放入一個隊列中，可以重新用於顯示新單元格。該單元格仍然保留對其圖像的引用。

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath 
{ 
    ExampleCell *cell = (ExampleCell*)[collectionView dequeueReusableCellWithReuseIdentifier:@"imageCell" forIndexPath:indexPath]; 

    if(!cell) // no queued cell to dequeue 
    { 
      // create a new cell to use 
    } 

    // clear any previous image if necessary 
    cell.parseImage.image = nil; 

    PFObject * imageObject = [self.imageFilesArray objectAtIndex:indexPath.row]; 
    PFFile * imageFile=[imageObject objectForKey:@"image"]; 

    [imageFile getDataInBackgroundWithBlock:^(NSData *data, NSError *error) 
    { 
      if(!error) 
       cell.parseImage.image=[UIImage imageWithData:data]; 
    }]; 

    return cell; 
}