How to add constraints to growing dynamic views programmatically?

Question

I have array based on its count i want to have multiple uiviews displayed next to each other on a scrollview which i should be able to scroll horizontally till the last view .How can i add constraints those views programmatically?

how can i add constraints to those Views so that each view will have its edges fixed to the corner of xib for device orientations?

Answer 1

It consists of:

1. Defining the height constraints for each subview like so:

    V:|[subview(==scrollView)]| 

   The |[subview]| tells it to adjust the contentSize to the height of the subview. The (==scrollView) says that the height of the subview should be the same as the bounds of the scroll view. (Those two things sounds similar, but they're completely different things.)

2. You want set of horizontal constraints that translate to something like:

    H:|[subview1(==scrollView)][subview2(==scrollView)][subview3(==scrollView)]| 

So, programmatically, that looks something like:

scrollView.pagingEnabled = true

var previousSubview: UIView!
var views: [String: UIView]!

for object in objects {
    let subview = UIView()
    subview.setTranslatesAutoresizingMaskIntoConstraints(false)
    scrollView.addSubview(subview)

    views = ["subview" : subview, "scrollView" : scrollView]
    if previousSubview == nil {
        // it's first subview, so leading constraint is to the scroll view

        scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[subview(==scrollView)]", options: nil, metrics: nil, views: views))
    } else {
        // it's not first subview, so leading constraint is to the previous subview

        views["previousSubview"] = previousSubview
        scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:[previousSubview][subview(==scrollView)]", options: nil, metrics: nil, views: views))
    }

    scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|[subview(==scrollView)]|", options: nil, metrics: nil, views: views))

    previousSubview = subview
}
scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:[previousSubview]|", options: nil, metrics: nil, views: views))

Clearly that's a Swift implementation, but the Objective-C implementation is functionally identical (same API calls, same sets of constraints). But hopefully this illustrates the idea.

---

Having said that, I agree with PraveenM, that a collection view is often a more prudent way to handle this sort of UI. Or, if these subviews are very complicated and would benefit from having their own view controllers associated with them, a page view controller is another alternative. Adding all of these views to the scroll view up front is more complicated and is an extravagant use of memory.