Search code examples
iosuiimageviewstoryboardnslayoutconstraint

UIImageView disappears when aspect ratio constraint applied


Xcode 9.3, MacBook Pro running OS 10.13.4

When I add an aspect ratio constraint to a UIView in IB, the view doesn't render in the simulator. Trying to find out where it went, I logged the relevant frame coordinates with the constraint absent, and then present. The coordinates appear identical, but see screenshots for difference.

With no constraints:

self.view.center = (207.0, 368.0)
self.thumbView.center = (93.0, 207.5)
self.viewFinder.center = (187.5, 163.5)
self.view.frame = (0.0, 0.0, 414.0, 736.0)
self.thumbView.frame = (30.0, 174.0, 126.0, 67.0)
self.viewFinder.frame = (16.0, 75.0, 343.0, 177.0)

With only aspect ratio constraints:

self.view.center = (207.0, 368.0)
self.thumbView.center = (93.0, 207.5)
self.viewFinder.center = (187.5, 163.5)
self.view.frame = (0.0, 0.0, 414.0, 736.0)
self.thumbView.frame = (30.0, 174.0, 126.0, 67.0)
self.viewFinder.frame = (16.0, 75.0, 343.0, 177.0)

Sure would appreciate some help if you've got any ideas!

Here's a shot of the scene in IB. The large UIImageView is viewFinder, the small one is thumbView:

enter image description here

Here's what it looks like with no constraints:

enter image description here

And here's what it looks like after I add the aspect ratio constraint:

enter image description here

EDIT 1

Per comment by @Anton below, I added Proximity restraints from the bottom and sides of the viewFinder to the thumbView. However, this produced no change--I still get coordinates that indicate the presence of thumbView, but it remains invisible.


Solution

  • The short answer is: try adding also constraints for x and y position to the thumb view (for example align its' leading and bottom edges to viewFinder). You could get the same frames just because you check it before autolayout does its' job (in viewDidLoad for example). Also set some image to that image view or set constraint for one of the dimensions (without such constraint autolayout tries to use intrinsic size which depends on content for UIImageView). Also after that you have to check Interface builder for other errors, cause it most likely will require setting constraints to views, your thumbView depends on

    If you do really have only one constraint for thumb view and its' aspect ratio constraint you probably get an error in interface builder which tells you that you have to set constraints for x and y coordinates of that view. Without such constraints you get an ambiguous layout which means that there are many variations of how to set the position of your view.

    While there's no constraints at all, system translates frame and autoresizing mask of the view into constraints so that you got valid set of constraints to set view position and size, that's why view is visible. Since you add any constraints to view, you are supposed to add enough constraints to clearly define position and size of that view by those constraints.