title: Programmatically add subviews to a UIStackView
body: <p>I'm trying to implement a table view cell that displays a series of icons that represent home amenities (e.g. towels, wifi, laundry, etc.).  The cell could potentially display a large number of amenities (depending on how many the home has), so I'll display a maximum of three and indicate that you can view more by clicking on the cell if there are more than three. Here is what it should look like (from Airbnb's app):</p>
  
  <p><a href="https://i.stack.imgur.com/tQAXc.png" rel="noreferrer"><img src="https://i.stack.imgur.com/tQAXc.png" alt="enter image description here"></a></p>
  
  <p>I am trying to do this by dynamically adding UIImageViews to a UIStackView in the table view cell. I am using a UIStackView with alignment set to "Fill" and distribution set to "Equal spacing", the idea being that the stack view will evenly space out the icons no matter how many I add to it.</p>
  
  <p>I set up the stack view in Storyboard. It has constraints to the top, bottom, left, and right <strong>margins</strong> of its content view, so that it fills the table view cell, up to the margins.</p>
  
  <p>Here is the code I am using to try to dynamically add UIImageViews to the cell. Note <code>amenities</code> is an array of strings equal to the names of the icons in my image assets folder:</p>
  
  <pre><code>        cell.stackView.backgroundColor = UIColor.greenColor()
          var i = 0
          while (i &lt; amenities.count &amp;&amp; i &lt; 4) {
              if (i &lt; 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++
          }
  </code></pre>
  
  <p>The backgrounds of the image views are blue, and the background color of the stack view is green. Here is the result, for a case where the house has three amenities:</p>
  
  <p><a href="https://i.stack.imgur.com/3h2NU.png" rel="noreferrer"><img src="https://i.stack.imgur.com/3h2NU.png" alt="enter image description here"></a></p>
  
  <p>Looks like all the image views are being pushed on top of one another to the left of the screen. They also fill the cell's content view from top to bottom, even though the stack view is pinned to the content view margins. There's no green in sight so it appears the stack view is not remaining pinned to the margins of the cell. </p>
  
  <p>Any idea what's wrong here?</p>