当我尝试以编程方式添加 UIView 时，UITableViewCell 高度不会自动调整（而是压扁我的 UIView）

Posted 2023-03-12

【中文标题】当我尝试以编程方式添加 UIView 时，UITableViewCell 高度不会自动调整（而是压扁我的 UIView）

【英文标题】：UITableViewCell height does not auto adjust (and instead squashed my UIView) when I try to add a UIView programmatically

【发布时间】：2018-05-28 22:33:47

【问题描述】：

环境...Swift 4.0、ios 11.0+

这里是 Swift 和苹果开发的新手 .. 我正在尝试向 UITableViewCell 添加一个 UIView（高度不同）。 UIView 似乎已正确添加，但 UITableViewCell 未调整其高度以显示整个 UIView。

遇到了这个：https://***.com/a/36422189/3681880。我试图通过从头开始创建这个特定示例来回归基础，以确保单元格行高度根据标签大小进行调整。正如预期的那样，这对我有用。

下一步，我尝试将 UIImageView 添加到 MyCustomCell 实现中，这就是我的问题所在......

class MyCustomCell: UITableViewCell 

    @IBOutlet weak var myCellLabel: UILabel!

    override func awakeFromNib() 
        super.awakeFromNib()

        let imageView = UIImageView(frame: CGRect(x:0.0,y:0.0,width:100.0,height:100.0))
        imageView.image = UIImage(named:"addData_20pt")

        contentView.addSubview(imageView)

        imageView.translatesAutoresizingMaskIntoConstraints = false
        imageView.topAnchor.constraint(equalTo: self.topAnchor, constant: 20).isActive = true
        imageView.bottomAnchor.constraint(equalTo: self.bottomAnchor).isActive = true
        imageView.leadingAnchor.constraint(equalTo: self.leadingAnchor, constant: 10).isActive = true
        imageView.trailingAnchor.constraint(equalTo: self.trailingAnchor, constant: -10).isActive = true
    

在屏幕截图中，您可以看到所有图像都被压扁以适合顶行。如何让单元格扩展以适应图像？

ugly screenshot of tableview now

（为这张非常丑陋的桌子道歉 - 只是为了理解这个概念而把它放在一起！）

为了快速参考，这是上面引用的帖子中的 ViewController 代码

import UIKit
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource 

    // These strings will be the data for the table view cells
    let animals: [String] = [
        "Ten horses:  horse horse horse horse horse horse horse horse horse horse ",
        "Three cows:  cow, cow, cow",
        "One camel:  camel",
        "Ninety-nine sheep:  sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep baaaa sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep",
        "Thirty goats:  goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat "]

    // Don't forget to enter this in IB also
    let cellReuseIdentifier = "cell"

    @IBOutlet var tableView: UITableView!

    override func viewDidLoad() 
        super.viewDidLoad()

        // delegate and data source
        tableView.delegate = self
        tableView.dataSource = self

        // Along with auto layout, these are the keys for enabling variable cell height
        tableView.estimatedRowHeight = 44.0
        tableView.rowHeight = UITableViewAutomaticDimension
    

    // number of rows in table view
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int 
        return self.animals.count
    

    // create a cell for each table view row
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell 

        let cell:MyCustomCell = self.tableView.dequeueReusableCell(withIdentifier: cellReuseIdentifier) as! MyCustomCell
        cell.myCellLabel.text = self.animals[indexPath.row]
        return cell
    

    // method to run when table view cell is tapped
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) 
        print("You tapped cell number \(indexPath.row).")
    

【问题讨论】：

您正在使用动态大小的单元格，您的单元格将根据它们拥有的标签的高度调整它们的大小。现在您要添加UIImageView 并且您希望单元格高度仅由图像高度确定？如果这样做，标签中的文本将被截断。所以你需要做的是，你必须将你的图像视图相对于标签放置。

【参考方案1】：

因此，您仅使用标签设置了单元格的大小。我不知道您想如何查看您的单元格，但如果您希望单元格的大小根据标签或 imageView 进行更改，那么我建议您执行以下操作：

1)在 XIB 中设置你的 imageView 而不是代码

2) 像这样设置约束：

您可以在 XIB 中设置您的图像或：

imageView.image = UIIMage(named: "YourImageName")

我的解决方案是这样的：

或者你可以随意安排，使用 imageView 的属性“grater of equal”

【讨论】：

谢谢！我设法按照您上面的说明在情节提要上完成了它，并以编程方式对其进行了翻译（以防有人感兴趣！）

【参考方案2】：

添加这个作为完成的答案...

在 Sergey 的回答的帮助下，我设法在情节提要和编程中完成了这项工作。最重要的是玩弄“大于或等于”约束。谢谢谢尔盖！

another ugly tableview screenshot with cell row height adjusted

class MyCustomCell: UITableViewCell 

    @IBOutlet weak var myCellLabel: UILabel!

    override func awakeFromNib() 
        super.awakeFromNib()
        let myView = UIImageView()
        myView.image = UIImage(named:"addData_20pt")
        contentView.addSubview(myView)
        myView.backgroundColor = UIColor.red
        myView.translatesAutoresizingMaskIntoConstraints = false
        myView.topAnchor.constraint(equalTo: myCellLabel.bottomAnchor, constant: 20).isActive = true
        myView.bottomAnchor.constraint(equalTo: self.bottomAnchor).isActive = true
        myView.leadingAnchor.constraint(equalTo: self.leadingAnchor, constant: 0).isActive = true
        myView.trailingAnchor.constraint(equalTo: self.trailingAnchor, constant: 0).isActive = true
        myView.heightAnchor.constraint(greaterThanOrEqualToConstant: 100.0).isActive = true