如何为 uitableviewcell 设置自动布局约束

Question

我需要为 UITableViewController 下的 UITableViewCell 设置前导和尾随。

UITableViewCell 的特定类，我在下面添加了代码。

 override func layoutSubviews() {
        self.frame = CGRect(x: 10.0, y:  self.frame.origin.y, width: 390.0, height: self.frame.size.height)
        super.layoutSubviews()
    }

上面在前导和尾随留下空格。但是当我在 iPhone 5s 和 4 模拟器中测试时出现的问题会导致水平滚动。

由于宽度恒定，我教了这个问题。 所以我从 UITableViewcell 中得到了特定的标签字段宽度并减去了 10.0

我已针对宽度问题尝试了以下代码。但是，没有任何结果。

func setFrame(x: CGFloat, y: CGFloat , width: CGFloat , height: CGFloat ) {
        let newX = x.isNaN ? self.frame.origin.x : x
        let newY = y.isNaN ? self.frame.origin.y : y
        let newWidth = width.isNaN ? self.bounds.size.width : width
        let newHeight = height.isNaN ? self.bounds.size.height : height

        self.frame = CGRect(x: newX, y: newY, width: newWidth, height: newHeight)
    }
    override func layoutSubviews() {
        let width = (greetingLabel.bounds.size.width - 10.0)
        setFrame(x: 5.0, y: 5.0, width:width, height: self.frame.height)
    }

我已尝试将所有字段保留在 View 中，但 UI 看起来不太好。

请提供一些关于如何设置 UITableViewCell 的前导和尾随的输入。

我想实现这样的画面：

enter image description here

Answer 1

在你的情况下，我会让单元格的contentView 透明（contentView.backgroundColor = .clear）。然后我将向单元格添加一个新属性，我们将其命名为newContentView，将其添加到contentView，并使用约束使其尽可能远离边缘。然后只需使用newContentView 作为您要添加内容的空间。

class CustomCell: UITableViewCell {
    fileprivate let newContentView = UIView()

    override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)

        self.backgroundColor = .clear
        self.contentView.backgroundColor = .clear

        self.contentView.addSubview(newContentView)
        newContentView.backgroundColor = .white

        newContentView.translatesAutoresizingMaskIntoConstraints = false
        // in this case edge insets will be 10 per each side
        NSLayoutConstraint.activate([
            newContentView.topAnchor.constraint(equalTo: self.contentView.topAnchor, constant: 10),
            newContentView.leadingAnchor.constraint(equalTo: self.contentView.leadingAnchor, constant: 10),
            newContentView.trailingAnchor.constraint(equalTo: self.contentView.trailingAnchor, constant: -10),
            newContentView.bottomAnchor.constraint(equalTo: self.contentView.bottomAnchor, constant: -10),
            ])

        // and from now on, use newContentView as the holder of the subviews
    }

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

Answer 2

您不应该自己更改单元格的框架，因为这是表格/集合视图的责任。如果看一下 Cell，你会注意到它总是有一个内容视图，所有元素都应该放在里面。不应更改内容视图的约束或框架，但您可以相对于它放置元素。

关于您的代码 - 设置框架与约束完全无关。 （当然你有 translatesAutoresizingMaskIntoConstraints == true 帧会被 UIKit 转换成约束，但仍然不是设置约束）

我建议您在界面构建器中进行布局，这将节省您数小时的时间，使您的代码更清晰并提高您的技能。您只需将车道拖放到单元格中，选择它并设置您需要的约束。

要从您的代码中动态设置约束，您需要创建它们：

例如：

override func awakeFromNib() {
    super.awakeFromNib()
    /// Create your greeting label
    var  constraints = [NSLayoutConstraint]()
    constraints.append( greetingLabel.leftAnchor.constraintEqualToSystemSpacingAfter(contentView.leftAnchor, multiplier: 1.0))
    constraints.append( contentView.rightAnchor.constraintEqualToSystemSpacingAfter(greetingLabel.rightAnchor, multiplier: 1.0))
    constraints.append(contentView.centerYAnchor.constraint(equalTo: greetingLabel.centerYAnchor))
    contentView.addConstraints(constraints)
}

Answer 3

也许对你有帮助：

class ExampleTableViewController: UITableViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        self.tableView.rowHeight = UITableViewAutomaticDimension
        self.tableView.estimatedRowHeight = 44
  }

    func tableView(_ tableView: UITableView, estimatedHeightForRowAt 
      indexPath: IndexPath) -> CGFloat {
     // optionally, return an calculated estimate for the cell heights
      }

// ...

详情请看这里：Link