從遠程URL添加圖像後，TableView滾動口吃

我正在構建一個iOS應用程序，它將XML項目添加到TableView（當然還有其他東西）。如果文章的縮略圖字段爲空，我想在TableView單元格或默認佔位符中顯示文章的縮略圖。從遠程URL添加圖像後，TableView滾動口吃

下面的代碼添加了文章中的縮略圖，但之後導致滾動的結果相當多。如果我只爲每個單元格使用佔位符圖像，一切都很好。我猜測我可能沒有使用最理想的方法來添加縮略圖，不知道是否會導致問題。

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { 
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"idCellNewsTitle"]; 
    if (cell == nil) { 
     cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:@"idCellNewsTitle"]; 
    } 
    NSDictionary *dict = [self.arrNewsData objectAtIndex:indexPath.row]; 
    cell.imageView.image = [UIImage imageNamed:@"holder-small.jpg"]; 
    cell.textLabel.text = [dict objectForKey:@"title"]; 
    cell.detailTextLabel.text = [dict objectForKey:@"pubDate"]; 
    if ([dict objectForKey:@"thumbnail"] != nil) { 
     NSData *imgData = [NSData dataWithContentsOfURL:[NSURL URLWithString: [dict objectForKey:@"thumbnail"]]]; 
     if (imgData) { 
      UIImage *image = [UIImage imageWithData:imgData]; 
      if (image) { 
       cell.imageView.image = image; 
      } 
     } 
    } 
    return cell; 
}

編碼在最新的XCode，測試在模擬器和一個新的iPod - 結果是既相同。在應用程序運行期間沒有任何警告或錯誤，滾動時CPU的峯值爲1％，內存保持在16 MB左右。

更新 - 視頻 這裏是一個視頻展示了這個問題的任何未來的菜鳥與比較 - 第一個例子是一個佔位符，第二個是沒有。 Video on YouTube

來源

2014-05-19 NightMICU

擷取圖片不這樣做「dataWithContentsOfURL」在主線程上，使用一個後臺線程完成這個任務 – Pawan

我剛學的iOS編程 - 你可以在此上闡述一下或者用一些示例代碼發佈答案？我真的很感激它。感謝您的反饋:) – NightMICU

您還應該緩存圖像，以便在每次UITableViewCell變爲可見時不會下載相同的圖像。 – Jonathan

取代你的代碼中的cellForRowAtIndexPath：

此行if ([dict objectForKey:@"thumbnail"] != nil)

這樣，你在後臺加載每個圖像，一旦其裝載相應的單元格更新的mainThread後。

dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_BACKGROUND, 0), ^(void) { 
     NSData *imgData = NSData *imgData = [NSData dataWithContentsOfURL:[NSURL URLWithString: [dict objectForKey:@"thumbnail"]]]; 
     if (imgData) { 
      UIImage *image = [UIImage imageWithData:imgData]; 

      dispatch_sync(dispatch_get_main_queue(), ^(void) { 
      UIImage *image = [UIImage imageWithData:imgData]; 
         if (image) { 
          cell.imageView.image = image; 
      } 
     }); 
    });

LazyTableImages Reference

來源

2014-05-19 19:46:55 Pawan

好的，清理了一下代碼後，我有這個工作 - 除了一件事外，它非常甜蜜。滾動現在是zippy，但當我滾動時，我看到我的佔位符閃爍進出。我是否應該省略佔位符圖像，並且只有在不存在縮略圖的情況下才將'cell.imageView'省略掉？ – NightMICU

我知道，你會抱怨這個。此問題的解決方案是緩存圖像。我會建議你使用這些解決方案的任何一個。 [SDWebImage]（https://github.com/rs/SDWebImage）「我總是喜歡這個」[AsyncImageView]（https://github.com/nicklockwood/AsyncImageView） – Pawan

通靈！謝謝你的提示。 +1和爲你選擇的答案:) – NightMICU

使用GCD

// Fetch using GCD 
    dispatch_queue_t downloadThumbnailQueue = dispatch_queue_create("Get Photo Thumbnail", NULL); 
    dispatch_async(downloadThumbnailQueue, ^{ 
    UIImage *image = [self getTopPlacePhotoThumbnail:photo]; 
    dispatch_async(dispatch_get_main_queue(), ^{ 
     UITableViewCell *cellToUpdate = [self.tableView cellForRowAtIndexPath:indexPath]; // create a copy of the cell to avoid keeping a strong pointer to "cell" since that one may have been reused by the time the block is ready to update it. 
     if (cellToUpdate != nil) { 
      [cellToUpdate.imageView setImage:image]; 
      [cellToUpdate setNeedsLayout]; 
     } 
    }); 
    });

來源

2014-05-19 19:52:34

這會後'if（[dict objectForKey：@「thumbnail」]！= nil）{'？' – NightMICU

從遠程URL添加圖像後，TableView滾動口吃

回答

相關問題