Swift 1.2 and Parse: Issue with retrieving images

Question

I'm currently working on an application that displays images at certain locations. The issue is the following:

When the user clicks on the location in the MapView it goes to an empty collection view. If the user pulls to refresh, the spinner is active but the images do not load. However, if the user goes back to the MapView and then clicks on the location again, the images are loaded in the collection view. Of course we are trying to get the images loaded when the user first goes to the collection view.

I think is likely a small issue, but after hours of trying different various recommendations from different sources we simply cannot get it to work properly.

Any help would be very much appreciated.

Thank you.

Here is my code for the PFQueryCollectionViewController:

import UIKit

class PhotoGridCollectionViewController: PFQueryCollectionViewController {

  var savedPics: [UIImage]?

  func loadImages() -> PFQuery {

    var query = PFQuery(className: "UserPhoto")
    query.orderByDescending("timeTaken")

    return query

  }


  override func viewDidAppear(animated: Bool) {

  }

  override func viewDidLoad() {
    super.viewDidLoad()

    loadImages()

  }


  override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
  }


  /*
  // MARK: - Navigation

  // In a storyboard-based application, you will often want to do a little preparation before navigation
  override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {
  // Get the new view controller using segue.destinationViewController.
  // Pass the selected object to the new view controller.
  }
  */

  // MARK: UICollectionViewDataSource

  override func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
    //#warning Incomplete method implementation -- Return the number of sections
    return 1
  }


  override func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    //#warning Incomplete method implementation -- Return the number of items in the section
    return self.objects.count
  }


  override func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath, object: PFObject?) -> PFCollectionViewCell? {

    let cell = collectionView.dequeueReusableCellWithReuseIdentifier("venuePhotoThumb", forIndexPath: indexPath) as! PhotoGridCollectionViewCell

    if let pfObject = object {
      cell.imageView.file = pfObject["imageFile"] as? PFFile
      cell.imageView.loadInBackground({ (img, err) -> Void in
        println("Download complete")
      })
    }

      return cell
  }
}

EDIT: I have now updated my code and it is a bit cleaner, but I'm still having the exact same issue.

Answer 1

In my previous answer I just used a plain old UICollectionViewController to solve the issue, but after a lot of digging I finally figured out how to correctly implement a PFQueryCollectionViewController.

There must be a placeholder image in the PFQueryCollectionViewController or your images will not load when the user first loads the PFQueryCollectionViewController.

Here is a bit of the code to illustrate this:

import UIKit
import Parse
import ParseUI

class PhotoCollectionViewController: PFQueryCollectionViewController {

...

var parseObject: PFObject!
var placeHolderView: UIView!

...  

override func viewDidLoad() {
    super.viewDidLoad()

    if let layout = collectionViewLayout as? UICollectionViewFlowLayout {
        layout.sectionInset = UIEdgeInsetsMake(5.0, 10.0, 5.0, 10.0)
        layout.minimumInteritemSpacing = 5.0
    }
}

...

// MARK: PFQuery
override func queryForCollection() -> PFQuery {
    let query = super.queryForCollection()
    query.whereKey("name", equalTo: parseObject!)
    query.orderByDescending("date")

    return query
}

override func collectionView(collectionView: UICollectionView,
        cellForItemAtIndexPath indexPath: NSIndexPath,
        object: PFObject?) -> PFCollectionViewCell? {

    let cell = collectionView.dequeueReusableCellWithReuseIdentifier("cell",
        forIndexPath: indexPath) as? CustomCollectionViewCell

    ...        

    // HERE YOU MUST HAVE A PLACEHOLDER IMAGE
    var initialThumbnail = UIImage(named: "thumbnail")
    cell?.collectionImageView.image = initialThumbnail
    if let imageFile = object?["image"] as? PFFile {
        cell?.collectionImageView.file = imageFile
        cell?.collectionImageView.loadInBackground()
    }

    return cell
}

...
}

The answer was quite simple, but as I am relatively new to iOS development it took some time to finally figure it out. The necessity for the placeholder image applies to both the PFQueryCollectionViewController and PFQueryTableViewController.