swift indexPath.row==0 works weirdly for UITableViewCell

Question

I am trying to make a table wherein first cell has a differernt layout than the rest. I want to put the image as background for first cell i.e it shd look something like this:

enter image description here

and here is the code for my implementation

 func imageCellAtIndexPath(indexPath:NSIndexPath) -> MainTableViewCell {
    let cell = self.tableView.dequeueReusableCellWithIdentifier(imageCellIdentifier) as MainTableViewCell
    let object = self.fetchedResultsController.objectAtIndexPath(indexPath) as NSManagedObject

    let eTitle:NSString = object.valueForKey("title")!.description
    let deTitle  = eTitle.stringByDecodingHTMLEntities()
cell.artTitle.text = deTitle


    var full_url = object.valueForKey("thumbnailURL")!.description
    var url = NSURL(string: full_url)
    var image: UIImage?
    var request: NSURLRequest = NSURLRequest(URL: url!)
    NSURLConnection.sendAsynchronousRequest(request, queue: NSOperationQueue.mainQueue(), completionHandler: {(response: NSURLResponse!, data: NSData!, error: NSError!) -> Void in

        image = UIImage(data: data)
        if((indexPath.row)==0)  {
        var imageView = UIImageView(frame: CGRectMake(10, 10, cell.frame.width - 10, cell.frame.height - 10))
        imageView.image = image
       cell.backgroundView = UIView()
      cell.backgroundView?.addSubview(imageView)

        }
        else{
        cell.thumb.image = image
        }
    })

    return cell
}

bt the problem is.. when i scroll down and scroll up back again, the background image starts repeating and the thumbnails also get overlapped as shown: enter image description here

If i scroll up and down again.. this is wht happens: enter image description here

i might have done some silly mistake bt m not able to figure out what it is. pls help

score 3 · Answer 1 · answered Feb 18 '15 at 08:44

3

The problem is that the cell is being reused by the tableView for efficiency purposes but it is never being reset.

You need to clear / remove the imageView from the background view if the cell is not at indexPath 0.

answered Feb 18 '15 at 08:44

Kris Gellci

9,539
6
40
47

Teemu Kurppa · Accepted Answer · 2015-02-18T09:11:13.307

In table views cells are reused and you should reset parts of the cell that are not relevant the specific version of the cell style you are after. Something like:

 if((indexPath.row)==0)  {
      let frame = CGRectMake(10, 10, 
                             cell.frame.width - 10, cell.frame.height - 10)
      var imageView = UIImageView(frame: frame)
      imageView.image = image
      cell.backgroundView = UIView()
      cell.backgroundView?.addSubview(imageView)

      // Reset 
      cell.thumb.image = nil
 } else{
      cell.thumb.image = image
      // Reset 
      cell.backgroundView = nil
 }

Even better and more idiomatic idea is to use separate UITableViewCell designs for these two cell types, each with different reuse identifiers. This way you don't need to care about resetting.

P.S. You should use dequeueReusableCellWithIdentifier:forIndexPath: instead of older dequeueReusableCellWithIdentifier: as it guarantees that a cell is returned.

I had started with making 2 different cells bt as there is core data involved, i switched to the easier one.. bt will definitely work on both of your suggestions once the basic app gets ready. thanks again :) — Swapna Lekshmanan, Feb 18 '15 at 09:04

swift indexPath.row==0 works weirdly for UITableViewCell

2 Answers2