Я пытаюсь реализовать ячейку табличного представления, которая отображает серию значков, представляющих домашние удобства (например, полотенца, Wi-Fi, прачечную и т. Д.). В ячейке потенциально может отображаться большое количество удобств (в зависимости от количества в доме), поэтому я покажу максимум три и укажу, что вы можете просмотреть больше, щелкнув ячейку, если их больше трех. Вот как это должно выглядеть (из приложения Airbnb):
Я пытаюсь сделать это, динамически добавляя UIImageViews в UIStackView в ячейке табличного представления. Я использую UIStackView с выравниванием, установленным на «Заливка», и установкой распределения на «Равный интервал», идея заключается в том, что в представлении стека значки будут равномерно размещаться независимо от того, сколько я добавляю к нему.
Я установил представление стека в раскадровке. У него есть ограничения на верхнее, нижнее, левое и правое поля представления содержимого, так что он заполняет ячейку представления таблицы вплоть до полей.
Вот код, который я использую, чтобы попытаться динамически добавить UIImageViews в ячейку. Примечание amenities - это массив строк, равных именам значков в папке моих изображений:
cell.stackView.backgroundColor = UIColor.greenColor()
var i = 0
while (i < amenities.count && i < 4) {
if (i < 3) {
let imageView = UIImageView(image: UIImage(named: amenities[i]))
imageView.contentMode = .ScaleAspectFit
imageView.translatesAutoresizingMaskIntoConstraints = false
imageView.backgroundColor = UIColor.blueColor()
// Add size constraints to the image view
let widthCst = NSLayoutConstraint(item: imageView, attribute: NSLayoutAttribute.Width, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant: 50)
imageView.addConstraint(widthCst)
// Add image view to stack view
cell.stackView.addSubview(imageView)
} else {
// Add a label to the stack view if there are more than three amenities
let label = UILabel()
label.text = "\(amens.count - i) more"
label.textAlignment = NSTextAlignment.Left
cell.stackView.addSubview(label)
}
i++
}
Фон представлений изображений синий, а цвет фона представления стека - зеленый. Вот результат для случая, когда в доме есть три удобства:
Похоже, что все изображения накладываются друг на друга в левую часть экрана. Они также заполняют представление содержимого ячейки сверху вниз, даже если представление стека закреплено на полях представления содержимого. В поле зрения нет зеленого цвета, поэтому кажется, что представление стека не остается прикрепленным к краям ячейки.
Есть идеи, что здесь не так?
