Position subviews on superview based on subview count - ios

Question

Subviews need to be placed from the center of super view based on subview count.
If subview count is odd, the middle view will be center to the super view and remaining will be placed with respect to it with item spacing.
If subview count is even, then subviews are to be placed with offset.
Is there any generic solution to solve this without too many conditions and calculations using autolayout?
All subviews are of same size

Answer 1

Solution 1: UIStackView
let totalSubviews = 4
let stackView = UIStackView()
view.addSubview(stackView)
stackView.translatesAutoresizingMaskIntoConstraints = false
stackView.axis = .Horizontal
stackView.distribution = .EqualSpacing
stackView.alignment = .Center
stackView.spacing = 10
stackView.centerXAnchor.constraintEqualToAnchor(view.centerXAnchor, constant: 0).active = true
stackView.centerYAnchor.constraintEqualToAnchor(view.centerYAnchor, constant: 0).active = true
stackView.backgroundColor = UIColor.greenColor()
for _ in 0 ..< totalSubviews {
let subview = UIView()
stackView.addArrangedSubview(subview)
subview.translatesAutoresizingMaskIntoConstraints = false
subview.backgroundColor = UIColor.redColor()
subview.heightAnchor.constraintEqualToConstant(50).active = true
subview.widthAnchor.constraintEqualToConstant(50).active = true
}
Solution 2: AutoLayout
You can do this generically using AutoLayout.
totalSubviews = 4
totalSubviews = 5
Code
let totalSubviews = 4
let spacing = CGFloat(20)
var subviews = [UIView]()
var previousSubview: UIView?
for i in 0 ..< totalSubviews {
let subview = UIView()
subviews.append(subview)
view.addSubview(subview)
subview.translatesAutoresizingMaskIntoConstraints = false
subview.backgroundColor = UIColor.redColor()
view.addConstraint(NSLayoutConstraint(item: subview, attribute: .Top, relatedBy: .Equal, toItem: view, attribute: .Top, multiplier: 1, constant: spacing))
if i == 0 {
view.addConstraint(NSLayoutConstraint(item: subview, attribute: .Left, relatedBy: .Equal, toItem: view, attribute: .Left, multiplier: 1, constant: spacing))
}
else if i < totalSubviews {
view.addConstraint(NSLayoutConstraint(item: subview, attribute: .Left, relatedBy: .Equal, toItem: previousSubview, attribute: .Right, multiplier: 1, constant: spacing))
}
if i == totalSubviews - 1 {
view.addConstraint(NSLayoutConstraint(item: subview, attribute: .Right, relatedBy: .Equal, toItem: view, attribute: .Right, multiplier: 1, constant: -spacing))
}
if i != 0 {
view.addConstraint(NSLayoutConstraint(item: subview, attribute: .Width, relatedBy: .Equal, toItem: previousSubview!, attribute: .Width, multiplier: 1, constant: 0))
}
view.addConstraint(NSLayoutConstraint(item: subview, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 0, constant: 100))
previousSubview = subview
}

Answer 2

You will have to take 1 more view inside main view which will include your odd or even number of subviews. Then you need to set Equal width and Equal height constraints between them. So as per your number of subviews and screen size, they all will automatically be positioned.