Multiple Parse.com row images displaying in Collectionview?

Question

I've got a single class, called "Collections". In that class I have multiple columns for 'name', 'location', 'image1', 'image2', 'image3' and 'image4'.

If I was only dealing with a single image and a tableview, I'd have no trouble. But I'm venturing outside what I know now, and can't seem to find any examples anywhere, dealing with Swift. I see it mentioned that either using a small number of column file/images is ok (3-4 like I'm doing), and if you're using more to do a relation (whatever that is).
Unfortunately, I haven't found any examples of how to actually pull down the images (if they exist).

The code is below, but all it does is pull the image1 image, since I don't know how to get image2, image3, and image4 in the collection view as well.

... Deleted a bunch of non-working code here ...

Adding new code here:

Here's the variables:

class ParseCollectionViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate, UISearchBarDelegate {

var currentObject : PFObject?
var collectionImages: [PFFile]?
var tappedObjectID: String!
var imageObject0: PFFile!
var imageObject1: PFFile!
var imageObject2: PFFile!
var imageObject3: PFFile!
var imageObject4: PFFile!
var imageObject5: PFFile!
var imageArray: [UIImage] = []
var collectionImage0: UIImage!
var collectionImage1: UIImage!
var collectionImage2: UIImage!
var collectionImage3: UIImage!
var collectionImage4: UIImage!
var collectionImage5: UIImage!
var imageView: PFImageView!

Here's the very ugly bit of code... I'm sure this is the perfect job for an array, but I'm not sure how to do it yet:

    func loadCollectionViewData() {

    // Build a parse query object
    var query = PFQuery(className:"Collections")
    query.whereKey("objectId", equalTo:tappedObjectID)
    query.findObjectsInBackgroundWithBlock({
        (objects: [AnyObject]?, error: NSError?) -> Void in
        if error == nil {
            println("Successfully retrieved \(objects!.count) records.")

            self.imageArray.removeAll(keepCapacity: true)

            for object in objects! {

                self.imageObject0 = object["image0"] as! PFFile
                self.imageObject0.getDataInBackgroundWithBlock({
                    (imageData: NSData?, error: NSError?) -> Void in
                    if error == nil {
                        self.collectionImage0 = UIImage(data:imageData!)!
                        println("Image0 successfully retrieved")
                        println(self.collectionImage0)


                    }

                    self.imageArray.append(self.collectionImage0)
                    self.collectionView.reloadData()
                    println("image0 imageArray: \(self.imageArray)")

                })

                self.imageObject1 = object["image1"] as! PFFile
                self.imageObject1.getDataInBackgroundWithBlock({
                    (imageData: NSData?, error: NSError?) -> Void in
                    if error == nil {
                        self.collectionImage1 = UIImage(data:imageData!)!
                        println("Image1 successfully retrieved")
                        println(self.collectionImage1)


                    }

                    self.imageArray.append(self.collectionImage1)
                    self.collectionView.reloadData()
                    println("image1 imageArray: \(self.imageArray)")

                })

                self.imageObject2 = object["image2"] as! PFFile
                self.imageObject2.getDataInBackgroundWithBlock({
                    (imageData: NSData?, error: NSError?) -> Void in
                    if error == nil {
                        self.collectionImage2 = UIImage(data:imageData!)!
                        println("Image2 successfully retrieved")
                        println(self.collectionImage2)


                    }

                    self.imageArray.append(self.collectionImage2)
                    self.collectionView.reloadData()
                    println("image0 imageArray: \(self.imageArray)")

                })

                self.imageObject3 = object["image3"] as! PFFile
                self.imageObject3.getDataInBackgroundWithBlock({
                    (imageData: NSData?, error: NSError?) -> Void in
                    if error == nil {
                        self.collectionImage3 = UIImage(data:imageData!)!
                        println("Image3 successfully retrieved")
                        println(self.collectionImage3)


                    }

                    self.imageArray.append(self.collectionImage3)
                    self.collectionView.reloadData()
                    println("image3 imageArray: \(self.imageArray)")

                })

                self.imageObject4 = object["image4"] as! PFFile
                self.imageObject4.getDataInBackgroundWithBlock({
                    (imageData: NSData?, error: NSError?) -> Void in
                    if error == nil {
                        self.collectionImage4 = UIImage(data:imageData!)!
                        println("Image4 successfully retrieved")
                        println(self.collectionImage4)


                    }

                    self.imageArray.append(self.collectionImage4)
                    self.collectionView.reloadData()
                    println("image4 imageArray: \(self.imageArray)")

                })

                self.imageObject5 = object["image0"] as! PFFile
                self.imageObject5.getDataInBackgroundWithBlock({
                    (imageData: NSData?, error: NSError?) -> Void in
                    if error == nil {
                        self.collectionImage5 = UIImage(data:imageData!)!
                        println("Image0 successfully retrieved")
                        println(self.collectionImage5)


                    }

                    self.imageArray.append(self.collectionImage5)
                    self.collectionView.reloadData()
                    println("image5 imageArray: \(self.imageArray)")

                })

            }

        } else {
            NSLog("Error: %@ %@", error!, error!.userInfo!)
        }


    })

        self.collectionView.reloadData()

}

and here's the cell stuff:

    func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {

    return imageArray.count
}

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

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

    cell.cellImage.image = UIImage(named: "question")

    cell.cellImage.image = imageArray[indexPath.row]

    return cell
}
    func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath indexPath: NSIndexPath) {
    let tappedObject = imageArray[indexPath.row]

    performSegueWithIdentifier("CollectionViewToDetailView", sender: tappedObject)
}

// In a storyboard-based application, you will often want to do a little preparation before navigation
override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {

    var detailObject : PFObject?
    if let imageArray = sender as? PFObject{
        detailObject = sender as? PFObject
    } else {
        // No cell selected in collectionView
        detailObject = PFObject(className:"Collections")
    }

    // Get a handle on the next story board controller and set the currentObject ready for the viewDidLoad method
    var detailScene = segue.destinationViewController as! ParseDetailViewController
    detailScene.detailObject = (detailObject)
    detailScene.currentObject = (currentObject)
}

Because of the random loading, I either need to figure out how to force the images to load in a certain order or I have to figure out which image is which when I tap on it so I can properly pass it onto the next viewcontroller, which is the detail viewcontroller.

Answer 1

You have to make more UIImageViews (or PFImageViews) for the images in your cell, then just repeat what you have for the first image for the rest (but change their names to match the columns where they are store on parse)

Alternatively you may want to implement PFImageViews and use their file properties & loadInBackground() methods.

Edit: You can iterate through your received objects and place the images into a new array and use that for your collection view.

Code example:

var parseOjbect = ["image1":NSData(), "image2":NSData(),"image3":NSData(),"image4":NSData()]

var receivedParseObjects = [parseOjbect]

var photosForCollectionView = [NSData]()

for receivedParseObject in receivedParseObjects {

photosForCollectionView.append(receivedParseObject["image1"]!)
photosForCollectionView.append(receivedParseObject["image2"]!)
photosForCollectionView.append(receivedParseObject["image3"]!)
photosForCollectionView.append(receivedParseObject["image4"]!)
}