SwiftのFlickrからUICollectionViewの画像を非同期にロードする

Question

UICollectionViewCellを継承するクラスを作成したUICollectionViewがあります。新しいクラスには、画像コンセント変数が含まれています。

私がこれまでに書いたコードでは、すべての画像が完全にダウンロードされるとセルが表示されます。これらの画像を非同期に読み込み、Flickrから個々の画像がダウンロードされるごとに各セルにデータが読み込まれます。

私はこれを処理するためにどのようにグランドセントラルディスパッチを取得しますか？

import UIKit 
import MapKit 
import CoreData 

class ImagesCollectionViewController : UIViewController, UICollectionViewDataSource, UICollectionViewDelegate{ 

    @IBOutlet weak var mapView: MKMapView! 

    @IBOutlet weak var collectionView: UICollectionView! 
    var mapLat : Double! 
    var mapLong : Double! 
    let flickrApi = Flickr() 
    var imageURLSet = [String]() 

    override func viewDidLoad() { 

     // set the location and zoom of the minimap 
     let clLocation = CLLocationCoordinate2D(latitude: mapLat, longitude: mapLong) 
     let span = MKCoordinateSpan(latitudeDelta: 2, longitudeDelta: 2) 

     mapView.setRegion(MKCoordinateRegion(center: clLocation, span: span), animated: false) 
     mapView.scrollEnabled = false 

     getImages() 
    } 

    func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { 
     return imageURLSet.count 
    } 

    func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int { 
     return imageURLSet.count 
    } 

    func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell { 

     let cell = collectionView.dequeueReusableCellWithReuseIdentifier("ImageCell", forIndexPath: indexPath) as! FlickrImageCellViewController 

     // This is where the cells are being populated 
     let url = NSURL(string: imageURLSet[indexPath.row]) 
     let data = NSData(contentsOfURL: url!) 
     let img = UIImage(data: data!) 
     cell.imageView.image = img 

     return cell 
    } 

    //Get images from the flickr API and store in array 

    func getImages(){ 

     let parameters : [String : AnyObject] = ["method": Flickr.Consts.GEO_METHOD, "format" : Flickr.Consts.FORMAT, "api_key": Flickr.Consts.API_KEY, "lat" : mapLat, "long" : mapLong, "nojsoncallback" : "1", "per_page" : "21", "extras" : "url_m"] 

     flickrApi.performGetRequest(parameters) { (data, error) in 


      for record in data as! [AnyObject]{ 
       if(record["url_m"] != nil){ 

        self.imageURLSet.append(record["url_m"] as! String) 

       } 
      } 
     } 
    } 

    override func viewDidAppear(animated: Bool) { 

     self.collectionView.reloadData() 
    } 
} 

Answer 1

あなたがSDWebImage試すことができますが、それはあなたに多くを助けることができる：

は、ここに私のコードです。

それとも、手動でダウンロードしたい、これが助けることができる。この

let queue = dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0) 
    dispatch_async(queue) {() -> Void in 

    let data = NSData(contentsOfURL: NSURL(string: url)!) 
    let img = UIImage(data: data!)! 
    dispatch_async(dispatch_get_main_queue(), { 
     // update your UI 
    }) 
} 

希望をしてみてください。

Answer 2

@truongky：あなたの答えは正しいです。しかし、再使用可能なセルの場合、画像がローカルに保存されていない場合、新しい画像がダウンロードされるまで、再使用されたセルに古い画像が表示されます。

したがって、cellForRowAtIndexPathでは、新しいイメージのダウンロードが開始される前にイメージをnilに設定する必要があります。

func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell { 

    let cell = collectionView.dequeueReusableCellWithReuseIdentifier("ImageCell", forIndexPath: indexPath) as! FlickrImageCellViewController 

    // set image to nil on reused cell 
    cell.imageView.image = nil 

    // This is where the cells are being populated 
    let url = NSURL(string: imageURLSet[indexPath.row]) 
    let data = NSData(contentsOfURL: url!) 
    let img = UIImage(data: data!) 
    cell.imageView.image = img 

    return cell 
}