CollecitonView does not always display data correctly - ios

I am trying to implement a UICollectionView with custom cells.
The setup is the following:
4 Cells
If I get the data of an downloaded image => fill the cell's imageView with that image.
else: use a placeholder.
The PFFiles of the images are saved within imageFileDic:[String:PFFile].
This is my UPDATED cellForItemAtIndexPath:
let collectionCell:SettingsCollectionViewCell =
collectionView.dequeueReusableCellWithReuseIdentifier("collectionCell",
forIndexPath: indexPath) as! SettingsCollectionViewCell
if indexPath.row < imageFileDic.count {
if let imageId = imageFileIds[indexPath.row] as? String {
if let imageData = imageFileDic[imageId]{
collectionCell.collectionViewImage.file = imageData
collectionCell.collectionViewImage.loadInBackground()
}
}
} else{
collectionCell.collectionViewButton.setImage(UIImage(), forState: .Normal)
collectionCell.collectionViewImage.image = UIImage(named: "CameraBild.png")
}
Now sometimes (1/5 times) my application decides to display an image twice, or in the position of cell nr. 4.
in my query I am always deleting the dictionaries and arrays before appending new data.
Any ideas?
Edit:
This is the PFQuery I am calling:
let imageQuery = PFQuery(className: "Images")
imageQuery.whereKey("sender", equalTo: objectID!)
imageQuery.addAscendingOrder("createdAt")
imageQuery.cachePolicy = .NetworkElseCache
imageQuery.findObjectsInBackgroundWithBlock { (objects, error) in
if error != nil {
createAlert(error!)
}
else{
if let objects = objects{
self.imageFileDic.removeAll()
self.imageFileIds.removeAll()
for object in objects{
if let id = object.objectId{
print("id found")
if let imageFile = object.objectForKey("imageFile") as? PFFile{
self.imageFileIds.append(id)
self.imageFileDic[id] = imageFile
if object == objects.last{
print(self.imageFileIds.count)
print(self.imageFileDic.count)
self.mainCollectionView.reloadData()
}
}
}
}
}
}
}
}

I think you should update image to main thread
dispatch_async(dispatch_get_main_queue()) {
collectionCell.collectionViewImage.file = imageData
collectionCell.collectionViewImage.loadInBackground()
}

Related

URLSession dataTask execution order

i am trying to fetch images data using URLSession dataTask the urls are fetched from a firebase firestore document that contains each download path using for loop in snapShotDocuments in ascending order, after that the urls are passed into the URLSession dataTask that retrieves the data then appending the result in an array tableCells[] to update a tableview, the problem is the order of the cells in the updated tableview is not the same order of the objects in tableCells array, i am expecting it has something to do with concurrency that i am not aware of here is my code
public func fetchCells() {
guard (UserDefaults.standard.value(forKeyPath: "email") as? String) != nil else {
return
}
spinner.textLabel.text = "Loading"
spinner.position = .center
spinner.show(in: tableView)
db.collection("ads").order(by: "timeStamp").addSnapshotListener { snapshot, error in
self.tableCells = []
guard error == nil , let snapShotDocuments = snapshot?.documents else {
return
}
guard !snapShotDocuments.isEmpty else {
print("snapshot is empty ")
DispatchQueue.main.async {
self.tableView.isHidden = true
self.spinner.dismiss()
}
return
}
for i in snapShotDocuments {
let documentData = i.data()
guard let imageURL = documentData["imageurl"] as? String , let imageStringURL = URL(string: imageURL) else {
print("no url ")
return
}
guard let descriptionLabel = documentData["adDescription"] as? String , let titleLabel = documentData["adTitle"] as? String , let timeStamp = documentData["timeStamp"] as? Double else {
print("error")
return
}
URLSession.shared.dataTask(with: imageStringURL) { data , _ , error in
guard error == nil , let data = data else {
return
}
let image = UIImage(data: data)
let newCell = adoptionCell(cellImage: image, descriptionLabel: descriptionLabel, titleLabel: titleLabel, timePosted: timeStamp, imageUrl: nil)
self.tableCells.append(newCell)
DispatchQueue.main.async {
self.tableView.reloadData()
self.spinner.dismiss()
}
}.resume()
}
}
}
yes correct some image might be loaded faster another is loaded slower. therefore position in final array is changed.
I would rather access tableCells in main thread. here I reload cells in batch. index is used for setting position of the cell in final array.
var tableCells = Array<TableCell?>(repeating: nil, count: snapShotDocuments.count) //preserve space for cells...
var count: Int32 = 0 // actual number of real load tasks
for tuple in snapShotDocuments.enumerated() {
let i = tuple.element
let index = tuple.offset //offset of cell in final array.
let documentData = i.data()
guard let imageURL = documentData["imageurl"] as? String , let imageStringURL = URL(string: imageURL) else {
print("no url ")
return
}
guard let descriptionLabel = documentData["adDescription"] as? String , let titleLabel = documentData["adTitle"] as? String , let timeStamp = documentData["timeStamp"] as? Double else {
print("error")
return
}
count += 1 //increment count as there is new task..
URLSession.shared.dataTask(with: imageStringURL) { data , _ , error in
if error == nil, let data = data {
let image = UIImage(data: data)
let newCell = adoptionCell(cellImage: image, descriptionLabel: descriptionLabel, titleLabel: titleLabel, timePosted: timeStamp, imageUrl: nil)
//self.tableCells.append(newCell)
tableCells[index] = newCell //because array has predefined capacity, thread safe...
}
guard OSAtomicDecrement32(&count) == 0 else { return }
//last task, then batch reload..
DispatchQueue.main.async { [weak self] in
guard let self = self else { return }
self.tableCells = tableCells.compactMap { $0 }
self.tableView.reloadData()
self.spinner.dismiss()
}
}.resume()
}
What you have:
for i in snapShotDocuments {
dataTask {
mutate tableCells (append) on background thread <- don't do that, A) not thread safe, and B) append won't happen in order they were dispatched, but the order they came back
dispatch back to main {
reload data <- don't do that, reload the individual rows if needed, or reload everything at the end
}
}
You're enqueuing a number of asynchronous operations that can take varying amount of time to complete. Enqueue them in order 1, 2, 3, 4 and they could come back in order 3, 1, 4, 2, for example.
What you want:
Your model, arranged data instances, let's say an array, of structs, not UITableViewCell's.
for i in snapShotDocuments {
dataTask {
process on background thread, but then
dispatch back to main {
look up in the model, the object for which we have the new data
mutate the model array
then reload row at index path for the row involved
}
}

UITableView, cellForRowAt problem in assigning data

when I am trying to assign data into a label in tableview cell while reading data from firestore document field value, here is the problem when i scroll the tableview the data in the tableview cells are moving, which looks very ugly.
self.tableView.register(UITableViewCell.self, forCellReuseIdentifier: "OpenCell")
let cell = tableView.dequeueReusableCell(withIdentifier: "OpenCell") as! OpenCell
let rcell = self.r[indexPath.row]
db.collection("collectionString").document(rcell.value).getDocument() { (docSnapshot, err) in
if let err=err {
print("Error getting documents: \(err)")
} else {
guard let docSnapshot = docSnapshot, (docSnapshot.exists) else {
return
}
let myData = docSnapshot.data()
let Name : String = myData!["Name"] as? String ?? ""
if Name == ""{
cell.name.text = "Name"
}
else{
cell.name.text = Name
}
}
}
Thanks in advance.

Swift update tableview async with S3 download function

I have an async problem - I have a function that loads images from S3, stores them into an array of UIImages (here called Images)
I also have a tableview that loads its cells from firebase fetched data, my question is, how to update the cell image once the async finishes loading ?
I'm also afraid that the queue of images won't match exactly the indexPath.row since some images might load faster than other images.
func download(key:String, myindex:NSIndexPath, myrow:Int) -> NSString {
let path:NSString = NSTemporaryDirectory().stringByAppendingString("image.jpg")
let url:NSURL = NSURL(fileURLWithPath: path as String)
// let downloadingFilePath = downloadingFileURL.path!
let downloadRequest = AWSS3TransferManagerDownloadRequest()
downloadRequest.bucket = "witnesstest/" + rootref.authData.uid
downloadRequest.key = key
downloadRequest.downloadingFileURL = url
switch (downloadRequest.state) {
case .NotStarted, .Paused:
let transferManager = AWSS3TransferManager.defaultS3TransferManager()
transferManager.download(downloadRequest).continueWithBlock({ (task) -> AnyObject! in
if let error = task.error {
if error.domain == AWSS3TransferManagerErrorDomain as String
&& AWSS3TransferManagerErrorType(rawValue: error.code) == AWSS3TransferManagerErrorType.Paused {
print("Download paused.")
} else {
print("download failed: [\(error)]")
}
} else if let exception = task.exception {
print("download failed: [\(exception)]")
} else {
dispatch_async(dispatch_get_main_queue(), { () -> Void in
let tempimage:UIImage = UIImage(contentsOfFile: path as String)!
print("dl ok")
self.Images.append(tempimage)
})
}
return nil
})
break
default:
break
}
return path
}
and the cell :
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
let cell: MainWitnessTableViewCell = self.tableView.dequeueReusableCellWithIdentifier("RIcell") as! MainWitnessTableViewCell
// populate the cell
let postitem = posts[indexPath.row]
cell.postOwner.text = postitem.author
cell.postContent.text = postitem.content
cell.postDate.text = postitem.createon
let myindex = indexPath
let myrow = indexPath.row
// cell.cellImage.image = Images[indexPath.row] // returns array index out of range
// download(postitem.imagekey, myindex: myindex, myrow: myrow)
return cell
}
You can just set the imageView's image after you download the image and at the same time set postitem's image property (assuming you add one). It's hard for me to understand everything your download method is doing, but I think the gist of what you want is something like:
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
let cell: MainWitnessTableViewCell = self.tableView.dequeueReusableCellWithIdentifier("RIcell") as! MainWitnessTableViewCell
// populate the cell
let postitem = posts[indexPath.row]
cell.postOwner.text = postitem.author
cell.postContent.text = postitem.content
cell.postDate.text = postitem.createon
//postitem should also have a imageURL property or you should have some way of getting the image url.
if post item.image == nil{
dispatch_queue_t imageFetchQ = dispatch_queue_create("image fetcher", NULL)
dispatch_async(imageFetchQ, ^{
let imageData = NSData(contentsOfURL: postitem.imageURL)
let image = UIImage(data: imageData)
postitem.image = image
dispatch_async(dispatch_get_main_queue(), ^{
//the UITableViewCell may have been dequeued and reused so check if the cell for the indexPath != nil
if tableView.cellForRowAtIndexPath(indexPath) != nil{
cell.imageView.image = image
}
})
})
return cell
}
I would recommend you create a cache of images and the indices they're supposed to be associated with, and then instead of loading all the images in your function, you would create the table view, and then for that specific cell ask for the image from your server or from the cache if it's already there, rather then trying to download them all async at one time

Synching parse object array with UIImageView array

I'm building an app for creating events which uses parse as a back end. The main interface is a collection view with a custom cell, which when flipped displays an array of UIImageViews added to the cell file as an IBOutlet collection.
#IBOutlet var imageViewArray: [UIImageView]!
Inside the event.getDataInBackground block I have this code, which doesn't get called for some reason, I think it will work once it is but does anyone know what's up? Thanks!
//gets profile pictures for image view array on back of cell
if let attendeeArray = event?.objectForKey("attendees") as? [PFUser] {
for var index = 0; index < attendeeArray.count; ++index {
let profileImageView = cell.imageViewArray[index]
let usr : PFUser = (attendeeArray[index] as PFUser?)!
if let picture = usr.objectForKey("profilePicture") as? PFFile {
picture.getDataInBackgroundWithBlock({ (data, error) -> Void in
profileImageView.image = UIImage(data: data!)
})
}
}
}
The whole cell for row at index path method (The creator image shows up and is called but the attendee array part is not).
func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
//sets up cell
let cell : EventCell = collectionView.dequeueReusableCellWithReuseIdentifier("cell", forIndexPath: indexPath) as! EventCell
//adds attend action
cell.attendButton.addTarget(self, action: "buttonTapped:", forControlEvents: UIControlEvents.TouchUpInside)
//queries parse for events
let event = events?[indexPath.row]
event?.eventImage.getDataInBackgroundWithBlock({ (data, error) -> Void in
if let data = data, image = UIImage(data: data) {
cell.eventBackgroundImage.image = image
cell.eventTitleLabel.text = event?.eventTitle
//gets profile picture of events creator
if let eventCreator = event?.objectForKey("user") as? PFUser {
if let creatorImage = eventCreator.objectForKey("profilePicture") as? PFFile {
creatorImage.getDataInBackgroundWithBlock({ (data, error) -> Void in
cell.creatorImageView.image = UIImage(data: data!)
})
}
}
//gets profile pictures for image view array on back of cell
if let attendeeArray = event?.objectForKey("attendees") as? [PFUser] {
for var index = 0; index < attendeeArray.count; ++index {
let profileImageView = cell.imageViewArray[index]
let usr : PFUser = (attendeeArray[index] as PFUser?)!
if let picture = usr.objectForKey("profilePicture") as? PFFile {
picture.getDataInBackgroundWithBlock({ (data, error) -> Void in
profileImageView.image = UIImage(data: data!)
})
}
}
}
//sets correct category for cell image
if event?.category == "" {
cell.categoryImageView.image = nil
}
if event?.category == "The Arts" {
cell.categoryImageView.image = UIImage(named: "Comedy")
}
if event?.category == "The Outdoors" {
cell.categoryImageView.image = UIImage(named: "Landscape")
}
if event?.category == "Other" {
cell.categoryImageView.image = UIImage(named: "Dice")
}
if event?.category == "Sports" {
cell.categoryImageView.image = UIImage(named: "Exercise")
}
if event?.category == "Academics" {
cell.categoryImageView.image = UIImage(named: "University")
}
if event?.category == "Science" {
cell.categoryImageView.image = UIImage(named: "Physics")
}
if event?.category == "Entertainment" {
cell.categoryImageView.image = UIImage(named: "Bowling")
}
if event?.category == "Food & Drinks" {
cell.categoryImageView.image = UIImage(named: "Food")
}
if let date = event?.eventDate {
let dateFormatter = NSDateFormatter()
dateFormatter.dateFormat = "yyyy-MM-dd"
cell.eventDescriptionLabel.text = event?.eventDescription
cell.eventDateLabel.text = dateFormatter.stringFromDate(date)
}
}
})
cell.layer.cornerRadius = 20
return cell
}
EDITED:
//gets profile pictures for image view array on back of cell
if let attendeeArray = event?.objectForKey("attendees") as? [PFUser] {
for var index = 0; index < attendeeArray.count; ++index {
let profileImageView = cell.imageViewArray[index]
let usr : PFUser = (attendeeArray[index] as PFUser?)!
usr.fetchIfNeededInBackgroundWithBlock({ (object: PFObject?, error: NSError?) -> Void in
if let picture = object!.objectForKey("profilePicture") as? PFFile {
picture.getDataInBackgroundWithBlock({ (data, error) -> Void in
profileImageView.image = UIImage(data: data!)
})
}
})
}
}
You need to fetch the usr before you can get picture
usr.fetchIfNeededInBackgroundWithBlock({ (object: PFObject?, error: NSError?) -> Void in
if let picture = object.objectForKey("profilePicture") as? PFFile {
picture.getDataInBackgroundWithBlock({ (data, error) -> Void in
profileImageView.image = UIImage(data: data!)
})
}
})

tableView showing same cell

I'm making an social application in which I want to display the comments from the users.
Now sometimes when I open the VC it will display the same cell twice (or sometimes even more). See the picture below:
The strange thing is when I 'println' the objects from the 'PFQuery Block' in the CellForRowAtIndexPath it shows the println 2 times or more. I have no idea how this comes.. Something to do with CachePolicy maybe?
P.s: No answer found at same problem: Here
}else {
let commentCell:commentTableViewCell = tableView.dequeueReusableCellWithIdentifier("commentCell") as commentTableViewCell
let commentIndex:NSIndexPath = NSIndexPath(forRow: indexPath.row-2, inSection: 0)
let comment:PFObject = userComments.objectAtIndex(commentIndex.row) as PFObject
// Comment Label
commentCell.commentLabel.text = comment.objectForKey("content") as String!
// Datum
let date:NSDate = NSDate(timeIntervalSinceNow: 1)
let string:NSString = date.timeAgoSinceDate(comment.createdAt)
commentCell.datumLabel.text = string
// Load each comment after row: 1
var userCommentImage:PFQuery = PFUser.query()
userCommentImage.whereKey("objectId", equalTo: comment.objectForKey("gebruiker").objectId)
userCommentImage.findObjectsInBackgroundWithBlock({
(objects:[AnyObject]!, error:NSError!) -> Void in
if error == nil{
println("How many reactions are there? = \(objects.count)")
let user:PFUser = (objects as NSArray).firstObject as PFUser
commentCell.userLabel.text = user.username
// Profile Image
let profileImage:PFFile = user["profileImage"] as PFFile
profileImage.getDataInBackgroundWithBlock({
(imageData:NSData!, error:NSError!) -> Void in
if error == nil{
let image = UIImage(data: imageData)
commentCell.userImageView.image = image
UIView.animateWithDuration(0.5, animations: {
commentCell.userImageView.alpha = 1
commentCell.userLabel.alpha = 1
commentCell.datumLabel.alpha = 1
commentCell.commentLabel.alpha = 1
})
}
})
}
})
return commentCell
}

Resources