Interface Builder Constraints

Question

I'm trying to create layout like this in interface builder.

I'm using constraints to make these views stretchable. Top view has left, right and top space bound to superview, and bottom space to bottom view. Bottom view has the left right and bottom space bound to superview.

On runtime I add ViewController views to both of them.

Issue here is that there is no constraint for Y of bottom view, IB shows red error arrow and so on. That is because I don't know exact height of it. Is there any "android wrap_content" constraint for yellow view to be with height which is equal to it's inner view added in runtime?

Answer 1

Just add height constraint to yellow view, for example:

NSLayoutConstraint *heightConstraint = [NSLayoutConstraint constraintWithItem:self.yellowView
                                                                        attribute:NSLayoutAttributeHeight
                                                                        relatedBy:NSLayoutRelationEqual
                                                                           toItem:self.view
                                                                        attribute:NSLayoutAttributeHeight
                                                                       multiplier:0.20f
                                                                         constant:0.0f];
heightConstraint.active = YES;

Answer 2

Add a constraint for the height of the yellow view. Then add an IBOutlet for that constraint so you can make changes to the constraint's constant value at runtime. If you need to calculate the size that satisfies the yellow view's constraints, you can use systemLayoutSizeFittingSize:.

Alternatively, you can rely on the yellow view's intrinsicContentSize. Add a placeholder Intrinsic Size for the view in Interface Builder. If your yellow view implements intrinsicContentSize or has constraints that give it an unambiguous height (e.g. if it contains a UILabel or UIImageView that is pinned at the top and the bottom), then that will be enough to appropriately size the view.