CODEWITHSUNDEEP
iphoneios8autolayoutuistoryboardsize-classes
Alex Stone
Alex Stone

Reputation: 47344

iOS8 how to fit a square view into rectangular parent using storyboard with autolayout and size classes?

I'm using a UIStoryboard with autolayout and size classes to handle rotating an iPhone in landscape mode. I'm dynamically resizing the view into two containers, each one of them is rectangular (like 300x260) and am trying to fit a square view into that container. I would like the view to pick the smaller dimension of the rectangle and size itself appropriately:

For example:

exhagerrated example:

enter image description here

Is there some clever autolayout trick I can use to make sure that the view will pick the smaller dimension (size or width) of it's parent using storyboard? I tried 1:1 aspect ratio constraint, but the view is still clipping (picks incorrect dimension)

Upvotes: 0

Views: 343

Answers (1)

Mats
Mats

Reputation: 8638

You need to add two constraints in addition to the ratio constraint. One specifying the height of the inner view is less than the height of outer view, and one specifying the width of the inner view is less than the width of outer view.

You could probably do it in Interface Builder, but in code it would be something like this:

UIView *outerView = ...;
UIView *innerView = ...;
[outerView addConstraints:@[
     [NSLayoutConstraint constraintWithItem:innerView
                                  attribute:NSLayoutAttributeWidth
                                  relatedBy:NSLayoutRelationLessThanOrEqual
                                     toItem:outerView
                                  attribute:NSLayoutAttributeWidth
                                 multiplier:1.0
                                   constant:0.0],
     [NSLayoutConstraint constraintWithItem:innerView
                                  attribute:NSLayoutAttributeHeight
                                  relatedBy:NSLayoutRelationLessThanOrEqual
                                     toItem:outerView
                                  attribute:NSLayoutAttributeHeight
                                 multiplier:1.0
                                   constant:0.0],
]];

You might also need to add a low priority constraint to make the inner view have a size larger than zero. enter image description here

enter image description here

Upvotes: 1

Related Questions