iOS 在 UITableViewCell 中以编程方式设置 UIImageView 约束在滚动 tableview 时变得困惑

Question

我以编程方式更改 UITableViewCell 内的 UIImageView 的 height。因此，当有图像 url 时，高度为 100.0 当图片 url 为 nil 时，高度为 0.0 。这是我在 tableViewCell 类中使用的代码:

func setConstraints(_height:CGFloat){
    self.commentImage.addConstraint(NSLayoutConstraint(item: self.commentImage,attribute: .height,relatedBy: .equal,toItem: self.commentImage,attribute: .width,multiplier: _height / 287.0,constant: 0))
    self.commentImage.updateConstraints()
    self.commentImage.layoutIfNeeded()
}

if let img = comment.image {
        let imgUrl = URL(string: img)
        self.commentImage.sd_setImage(with: imgUrl, placeholderImage: UIImage(named: "PlaceHolder Shop"))
        setConstraints(_height: 100.0)
    }else {
        self.commentImage.image = nil
        setConstraints(_height: 0.0)
    }

现在的问题是，当我滚动 tableview 时，一些没有图像 url 的行为 UIImageView 获取了 100.0 的高度，这留下了空白区域，如果我快速滚动 tableView，有时行中的图像会消失。

我应该怎么做才能解决这个问题？我在这里缺少什么？

Answer 1

带有 stackview 的 CustomTableViewCell

class CustomTableViewCell: UITableViewCell {

  let titleLbl = UILabel()
  let stackView = UIStackView()
  let imgView = UIImageView()

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

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
    }
  override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
    super.init(style: style, reuseIdentifier: reuseIdentifier)

    titleLbl.translatesAutoresizingMaskIntoConstraints = false
    addSubview(titleLbl)

    stackView.translatesAutoresizingMaskIntoConstraints = false
    stackView.axis = .vertical
    stackView.spacing = 0
    stackView.alignment = .fill
    stackView.distribution = .fill
    addSubview(stackView)

    imgView.translatesAutoresizingMaskIntoConstraints = false
    let imgViewHeight = imgView.heightAnchor.constraint(equalToConstant: 100)
    imgViewHeight.priority = .defaultLow
    imgViewHeight.isActive = true
    imgView.addConstraint(imgViewHeight)

    stackView.addArrangedSubview(imgView)

    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|[titleLbl]|", options: [], metrics: nil, views: ["titleLbl":titleLbl,"stackView":stackView]))
    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|[titleLbl(30)][stackView]|", options: [.alignAllLeading,.alignAllTrailing], metrics: nil, views: ["titleLbl":titleLbl,"stackView":stackView]))
  }

  required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
  }

}

具有自动高度 tableView 的 ViewController

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

  @IBOutlet var tableView: UITableView!

  override func viewDidLoad() {
    super.viewDidLoad()
    tableView.register(CustomTableViewCell.self, forCellReuseIdentifier: "CustomCell")
    tableView.rowHeight = UITableViewAutomaticDimension
    tableView.estimatedRowHeight = 130
  }

  func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 15
  }

  func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "CustomCell") as! CustomTableViewCell
    cell.titleLbl.text = "Row \(indexPath.row)"
    // set cell.imgView.image
    cell.imgView.isHidden = cell.imageView?.image == nil
    return cell
  }
}