Я полагаю, что проблема связана с использованием ячейки по умолчанию imageView
.
Само представление изображения не существует до тех пор, пока не установлено свойство .image
, поэтому в вашей ячейке init вы ограничиваетепользовательская метка для представления изображения 0,0,0,0
Затем в cellForRowAt
вы устанавливаете свойство .image
, и оно отображает это действие также устанавливает высоту contentView.Я не могу найти какие-либо документы на нем, и копаясь в отладке, я не могу найти никаких конфликтующих ограничений, поэтому я не совсем уверен, почему это происходит.
Два варианта:
1 - Вместо создания и добавления пользовательской метки установите .numberOfLines
по умолчанию .textLabel
на 0
.Этого достаточно .
2 - Если вам нужна настроенная метка, также добавьте пользовательский вид изображения.
Вариант 2 находится здесь:
class MyTableViewCell: UITableViewCell {
lazy var customLabel : UILabel = {
let lbl = UILabel()
lbl.translatesAutoresizingMaskIntoConstraints = false
lbl.numberOfLines = 0
lbl.setContentCompressionResistancePriority(.required, for: .vertical)
return lbl
}()
lazy var customImageView: UIImageView = {
let v = UIImageView()
v.translatesAutoresizingMaskIntoConstraints = false
return v
}()
override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
super.init(style: style, reuseIdentifier: reuseIdentifier)
setupLayout()
}
private func setupLayout(){
contentView.addSubview(customLabel)
contentView.addSubview(customImageView)
// constrain leading of imageView to be 15-pts from the leading of the contentView
let imgViewLeading = customImageView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 15)
// constrain width of imageView to 42-pts
let imgViewWidth = customImageView.widthAnchor.constraint(equalToConstant: 42)
// constrain height of imageView to be equal to width of imageView
let imgViewHeight = customImageView.heightAnchor.constraint(equalTo: customImageView.widthAnchor, multiplier: 1.0)
// center imageView vertically
let imgViewCenterY = customImageView.centerYAnchor.constraint(equalTo: contentView.centerYAnchor, constant: 0.0)
// top and bottom constraints for the imageView also need to be set,
// otherwise the image will exceed the height of the cell when there
// is not enough text to wrap and expand the height of the label
// constrain top of imageView to be *at least* 4-pts from the top of the cell
let imgViewTop = customImageView.topAnchor.constraint(greaterThanOrEqualTo: contentView.topAnchor, constant: 4)
// constrain bottom of imageView to be *at least* 4-pts from the bottom of the cell
let imgViewBottom = customImageView.topAnchor.constraint(lessThanOrEqualTo: contentView.bottomAnchor, constant: -4)
// constrain top of the label to be *at least* 4-pts from the top of the cell
let top = customLabel.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 4)
// if you want the text in the label vertically centered in the cell
// constrain bottom of the label to be *exactly* 4-pts from the bottom of the cell
let bottom = customLabel.bottomAnchor.constraint(equalTo: contentView.bottomAnchor, constant: -4)
// if you want the text in the label top-aligned in the cell
// constrain bottom of the label to be *at least* 4-pts from the bottom of the cell
// let bottom = customLabel.bottomAnchor.constraint(lessThanOrEqualTo: contentView.bottomAnchor, constant: -4)
// constrain leading of the label to be 5-pts from the trailing of the image
let leadingFromImage = customLabel.leadingAnchor.constraint(equalTo: customImageView.trailingAnchor, constant: 5)
// constrain the trailing of the label to the trailing of the contentView
let trailing = customLabel.trailingAnchor.constraint(equalTo: contentView.trailingAnchor)
NSLayoutConstraint.activate([
top, bottom, leadingFromImage, trailing,
imgViewLeading, imgViewCenterY, imgViewWidth, imgViewHeight,
imgViewTop, imgViewBottom
])
}
required init?(coder aDecoder: NSCoder) {
fatalError()
}
}
class HoneyViewController: UIViewController {
var datasource = [
"It would have been a great day had Manchester United Lost its game. Anyhow I hope tomorrow Arsenal will win the game",
"One line.",
"Two\nLines.",
]
lazy var tableView : UITableView = {
let table = UITableView()
table.delegate = self
table.dataSource = self
table.translatesAutoresizingMaskIntoConstraints = false
table.estimatedRowHeight = 100
table.rowHeight = UITableViewAutomaticDimension
return table
}()
override func viewDidLoad() {
super.viewDidLoad()
view.addSubview(tableView)
tableView.pinToAllEdges(of: view)
tableView.register(MyTableViewCell.self, forCellReuseIdentifier: "id")
}
}
extension HoneyViewController: UITableViewDelegate, UITableViewDataSource {
func numberOfSections(in tableView: UITableView) -> Int {
return 1
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return datasource.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "id", for: indexPath) as! MyTableViewCell
cell.customLabel.text = datasource[indexPath.row]
logInfo(of: cell)
cell.accessoryType = .detailDisclosureButton
cell.customImageView.image = UIImage(named: "Honey")
logInfo(of: cell)
print("---------")
return cell
}
private func logInfo(of cell: MyTableViewCell){
print("boundsWidth: \(cell.contentView.bounds.width) | maxLayoutWidth: \(cell.contentView.bounds.width - 44 - 15 - 5) | systemLayoutSizeFitting : \(cell.customLabel.systemLayoutSizeFitting(UILayoutFittingCompressedSize))")
}
}
extension UIView{
func pinToAllEdges(of view: UIView){
let leading = leadingAnchor.constraint(equalTo: view.leadingAnchor)
let top = topAnchor.constraint(equalTo: view.topAnchor)
let trailing = trailingAnchor.constraint(equalTo: view.trailingAnchor)
let bottom = bottomAnchor.constraint(equalTo: view.bottomAnchor)
NSLayoutConstraint.activate([leading, top, trailing, bottom])
}
}
Редактировать:
Требуется еще пара ограничений.Если в ячейке достаточно текста только для одной строки (без переноса), высота imageView превысит высоту ячейки:
Итак, мыдобавьте верхние и нижние ограничения в imageView, чтобы они соответствовали как минимум верху и низу ячейки:
и, этовероятно, будет выглядеть немного лучше с некоторыми отступами, поэтому мы ограничиваем верхнюю и нижнюю часть imageView на не менее 4 пункта от верха и низа ячейки:
При желании мы также можем «выровнять» текст в метке сверху, ограничив его основание равным по крайней мере 4 пункта от нижней части,вместо точно 4 пункта снизу:
Комментарии в моем отредактированном коде должны объяснять каждое из этих различий.