以編程方式將UIImageView添加到UITableViewCell

Question

我有一個自定義UITableViewCell ，它顯示帶有縮略圖的視頻。 我正在以編程方式添加縮略圖UIImageView 。 但是，當我的UITableView有多於一行時，單元格的UIImageView顯示在其他所有單元格中。 例如，如果我有2個單元格，則UIImageView在單元格1中看起來很好，但是單元格2 UIImageView在單元格3中顯示。很抱歉，這令人困惑。 讓我知道是否需要更多信息。

這是我在cellForIndexPath使用的代碼：

 func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
    let cell = self.tableView.dequeueReusableCellWithIdentifier("videoCell")! as! VideoCell
    cell.selectionStyle = UITableViewCellSelectionStyle.None // get rid of highlight when tapping a cell

    if videoCollections.count > 0 {
        let singleVideoCollection = videoCollections[indexPath.row]
        // get video clips from PFRelation
        let clips = singleVideoCollection.relationForKey("clips")
        let query = clips.query()

        query.findObjectsInBackgroundWithBlock { (clipObjects, error) -> Void in

            if error == nil {

                for (index, clip) in (clipObjects?.enumerate())! {
                    if index == 0 { // first clip

                        let firstThumbnailImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 54, height: 54))
                        firstThumbnailImageView.center = cell.center
                        firstThumbnailImageView.layer.cornerRadius = firstThumbnailImageView.frame.height / 2
                        firstThumbnailImageView.clipsToBounds = true
                        let thumbnail = clip.objectForKey("thumbnail")
                        thumbnail!.getDataInBackgroundWithBlock { (imageData: NSData?, error: NSError?) -> Void in
                            if (error == nil) {
                                firstThumbnailImageView.image = UIImage(data:imageData!)
                                cell.contentView.addSubview(firstThumbnailImageView)
                            }
                        }

                    }
                }
            }
        }

        return cell

    }
}

這是我有2個單元格時的結果。 注意第二個UIImageView在第三個單元格中的位置：

Answer 1

如果您不太了解tableview單元的重用，建議您在委托方法中設置與indexPath綁定的UI元素的hidden屬性。

像這樣添加代碼

if (clipObjects![indexPath.row].objectForKey("thumbnail")) {
    thumbnail.hidden = false
} else {
    thumbnail.hidden = true
}

Answer 2

在getDataInBackgroundWithBlock完成下載imageData的時間時，單元格對象可能已被其他indexPath重用。 在使用dequeueReusableCellWithIdentifier和cell.contentView.addSubview() ，您將添加過多的子視圖。 因此，您可以嘗試以下代碼。

class VideoCell: UITableViewCell {
//......
let firstThumbnailImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 54, height: 54))

override func prepareForReuse() {
  super.prepareForReuse()
  firstThumbnailImageView.image=nil;
}
//......
}


func tableView(tableView : UITableView, cellForRowAtIndexPath indexPath : NSIndexPath)->UITableViewCell {
//......
// let firstThumbnailImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 54, height: 54))

cell.firstThumbnailImageView.center = cell.center
cell.firstThumbnailImageView.layer.cornerRadius = firstThumbnailImageView.frame.height / 2
cell.firstThumbnailImageView.clipsToBounds = true
let thumbnail = clip.objectForKey("thumbnail")

//......

//cell.contentView.addSubview(firstThumbnailImageView)

//......
}