Swift 4 TableView單元不顯示正確的圖像

Question

當我滾動tableView時，UIImageView無法顯示正確的圖像。 如何快速使用4語言正確完成此操作。

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {


        let cell = tableView.dequeueReusableCell(withIdentifier: "cell")

        //Transform Data From ^ to load at the bottom
        tableView.transform = CGAffineTransform (scaleX: 1,y: -1);
        cell?.contentView.transform = CGAffineTransform (scaleX: 1,y: -1);
        cell?.accessoryView?.transform = CGAffineTransform (scaleX: 1,y: -1);


        let username = cell?.viewWithTag(1) as! UITextView
        username.text = messageArray[indexPath.row].username

        let message = cell?.viewWithTag(2) as! UITextView
        message.text = messageArray[indexPath.row].message

        let timeStamp = cell?.viewWithTag(3) as! UILabel
        timeStamp.text = messageArray[indexPath.row].timeStamp

        let imageView = cell?.viewWithTag(4) as! UIImageView
        let urlString = messageArray[indexPath.row].photoUrl
        imageView.layer.cornerRadius = 10
        imageView.clipsToBounds = true

        //Load profile image(on cell) with URL & Alamofire Library
        let downloadURL = NSURL(string: urlString!)
        imageView.af_setImage(withURL: downloadURL! as URL)

        return cell!
    }

Answer 1

您的解決方案 ：由於單元是可重用的，因此每次調用單元時都需要更新圖像。

最佳實踐 ：我認為您可以以更好的方式進行這種思考，並避免強行展開。

1. 每次通過網絡請求調用同一圖像時，請使用SDWebCache [ https://github.com/rs/SDWebImage]窗格進行圖像下載和緩存。
2. 使用Model方式將數據與單元格綁定。

單元類別

import UIKit
import SDWebCache

public struct TableCellModel {
    var username: String
    var imageURL: String
    var messsage: String
    var timeStamp: String
}

class TableCell: UITableViewCell {

    @IBOutlet weak var username: UITextView!
    @IBOutlet weak var message: UITextView!
    @IBOutlet weak var timeStamp: UITextView!
    @IBOutlet weak var imageView: UIImageView!

    override func awakeFromNib() {
        super.awakeFromNib()
    }

    var item: Any? {
        didSet {
            self.configure(item)
        }
    }

    func configure(_ item: Any?) {
        if let model = item as? TableCellModel {
            self.username.text = model.username
            self.message.text = model.message
            self.timeStamp.text = model.timeStamp
            if let url = URL(model.imageURL) {
                self.imageView.sd_setImageWithURL(url)
            }
        }
    }
}

1. 將此類分配給情節提要中的tableview單元格的自定義類
2. 在視圖控制器中聲明var cellItems: [TableCellModel] = []
3. 在viewDidLoad()初始化數組

在視圖控制器中 ：在viewDidLoad()調用此方法

func setupData() {
        self.cellItems =  [TableCellModel(username: "ABC", imageURL: "www....", message: "your message", timeStamp: "22.33.2222" ),
                            TableCellModel(username: "ABC", imageURL: "www....", message: "your message", timeStamp: "22.33.2222" ),
                            TableCellModel(username: "ABC", imageURL: "www....", message: "your message", timeStamp: "22.33.2222" ),
                            TableCellModel(username: "ABC", imageURL: "www....", message: "your message", timeStamp: "22.33.2222" )]

self.tableView.reloadData()
}

而tableView cellforRow委托就像

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "cell") as! TableCell
    cell.item = self.cellItems[indexpath.row]
    return cell
}

Answer 2

在cellForRowAtIndexPath方法的開頭設置imageView.image = nil 。 您正在重用單元格。 有時您需要重置單元組件。

Answer 3

我們在這里使用可重用的單元格，它的確reuses舊圖像reuses了該單元格。 然后，您需要在每次在cellForRowAtIndexPath顯示該單元格時對其進行更新：

 func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "TableViewCell") as! MenuTableViewCell
        //MARK:-  Show the image
        let imgName = "menu_\(indexPath.row + 1)"
        //MARK:- Disable the UITableView selection highlighting
        cell.selectionStyle = .none
        return cell
    }

您可以像這樣或您Assets.xcassets任何格式在Assets.xcassets設置圖像-