Программно добавлять подпредставления в UIStackView

Question

Я пытаюсь реализовать ячейку табличного представления, которая отображает серию значков, представляющих домашние удобства (например, полотенца, Wi-Fi, прачечная и т. Д.). Ячейка потенциально может отображать большое количество удобств (в зависимости от того, сколько дома), поэтому я покажу максимум три и укажу, что вы можете просмотреть больше, нажав на ячейку, если их больше трех. Вот как это должно выглядеть (из приложения Airbnb):

Я пытаюсь сделать это, динамически добавляя UIImageViews к UIStackView в ячейке табличного представления. Я использую UIStackView с выравниванием, установленным на "Fill", и распределением, настроенным на "Equal spacing", идея состоит в том, что представление стека будет равномерно распределять значки независимо от того, сколько я добавлю к нему.

Я установил вид стека в раскадровке. Он имеет ограничения на верхнем, нижнем, левом и правом полях своего представления содержимого, так что он заполняет ячейку табличного представления вплоть до полей.

Вот код, который я использую, чтобы попытаться динамически добавить 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++
        }

Фоны представлений изображения синие, а цвет фона представления стека - зеленый. Вот результат для случая, когда в доме есть три удобства:

Похоже, что все виды изображений помещаются друг на друга слева от экрана. Они также заполняют представление содержимого ячейки сверху вниз, даже если представление стека прикреплено к полям представления содержимого. Зеленого цвета в поле зрения не видно, поэтому кажется, что вид стека не остается закрепленным на полях ячейки.

Есть идеи, что здесь не так?

Answer 1

Как сказал Дэн в комментариях, используйте addArrangedSubview добавить подпредставление, которое будет автоматически выложено UIStackView.

Обратите внимание, однако: если вы удалите представление из arrangedSubviews массив на UIStackView, это все еще подпредставление. Из документации UIStackView:

Представление стека гарантирует, что его свойство builtSubviews всегда является подмножеством его свойства subviews. В частности, в представлении стека применяются следующие правила:

• Когда представление стека добавляет представление в свой массив layoutSubviews, оно также добавляет это представление в качестве подпредставления, если оно еще не сделано.

• Когда подпредставление удаляется из представления стека, представление стека также удаляет его из массива layoutSubviews.

• Удаление представления из массива организованного Subviews не удаляет его как подпредставление. Представление стека больше не управляет размером и положением представления, но представление все еще является частью иерархии представления и отображается на экране, если оно является видимым.

Это всегда хорошая идея, чтобы начать с документации.