首页 > 解决方案 > UITableViewCell contentView insets and Auto Layout

问题描述

My problem is, that I want to inset the cell's contentView by 10 for each top, bottom, left, right. I want to use this space as a separator and disable the default table view separator. It looks like this without the insets:

without separation

Now there are two issues:

  1. Issue: Ambiguous height constraints (in the view debugger)
  2. No separator

1.

ambiguous height constraints

  1. I can change this by overriding layoutSubviews for my table view cell:

    override func layoutSubviews() {
       super.layoutSubviews()
    
       let contentViewFrame = self.contentView.frame
       let insetContentViewFrame = contentViewFrame.inset(by: UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10))
       self.contentView.frame = insetContentViewFrame
       self.selectedBackgroundView?.frame = insetContentViewFrame
    }
    

However this causes issue number 3:

issue no 3

Now the description label has issues:

Here is my Table View Cell (which uses autolayout so the labels define the cell height):

class NewsTableViewCell : UITableViewCell {

public private(set) var titleLabel: UILabel!
public private(set) var descriptionLabel: UILabel!

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

    self.tintColor = UIColor.white

    self.contentView.backgroundColor = UIColor.barTintColor
    self.contentView.layer.masksToBounds = false
    self.contentView.layer.cornerRadius = 10.0

    self.backgroundColor = UIColor.clear

    let layoutGuide = self.contentView.layoutMarginsGuide

    self.titleLabel = UILabel(frame: .zero)
    self.titleLabel.numberOfLines = 0
    self.titleLabel.font = UIFont.preferredFont(forTextStyle: .headline)
    self.titleLabel.textColor = UIColor.white
    self.titleLabel.adjustsFontSizeToFitWidth = false
    self.titleLabel.translatesAutoresizingMaskIntoConstraints = false
    self.titleLabel.textAlignment = .left
    self.contentView.addSubview(self.titleLabel)

    self.titleLabel.setContentCompressionResistancePriority(.required, for: .vertical)

    self.titleLabel.leadingAnchor.constraint(equalTo: layoutGuide.leadingAnchor).isActive = true
    self.titleLabel.trailingAnchor.constraint(equalTo: layoutGuide.trailingAnchor).isActive = true
    self.titleLabel.topAnchor.constraint(equalTo: layoutGuide.topAnchor).isActive = true

    self.descriptionLabel = UILabel(frame: .zero)
    self.descriptionLabel.numberOfLines = 0
    self.descriptionLabel.font = UIFont.preferredFont(forTextStyle: .subheadline)
    self.descriptionLabel.textColor = UIColor.lightGray
    self.descriptionLabel.adjustsFontSizeToFitWidth = false
    self.descriptionLabel.translatesAutoresizingMaskIntoConstraints = false
    self.descriptionLabel.textAlignment = .left
    self.contentView.addSubview(self.descriptionLabel)

    self.descriptionLabel.setContentCompressionResistancePriority(.required, for: .vertical)

    self.descriptionLabel.leadingAnchor.constraint(equalTo: layoutGuide.leadingAnchor).isActive = true
    self.descriptionLabel.trailingAnchor.constraint(equalTo: layoutGuide.trailingAnchor).isActive = true
    self.descriptionLabel.topAnchor.constraint(equalTo: self.titleLabel.bottomAnchor, constant: 5.0).isActive = true
    self.descriptionLabel.bottomAnchor.constraint(equalTo: layoutGuide.bottomAnchor).isActive = true

    let selectedView: UIView = UIView(frame: .zero)
    selectedView.backgroundColor = UIColor.gray
    selectedView.layer.cornerRadius = 10.0
    selectedView.layer.masksToBounds = false
    self.selectedBackgroundView = selectedView
}

That is my table view controller code:

self.tableView.rowHeight = UITableView.automaticDimension
self.tableView.estimatedRowHeight = 200.0
self.tableView.register(NewsTableViewCell.self, forCellReuseIdentifier: "NewsCell")
self.tableView.separatorStyle = .none

Is there any way I can both inset my contentView and have dynamically sizing labels (that define the cell height)? Thanks!

标签: iosswiftuitableview

解决方案


1-添加常量参数

 self.titleLabel.leadingAnchor.constraint(equalTo: layoutGuide.leadingAnchor,constant:10).isActive = true

用于前导、尾随、顶部和底部

2-

下限descriptionLabel约束的优先级为 999


推荐阅读