Converting old project to use Autolayout

I'm having a very difficult time converting an old project to Autolayout. I already removed my old launch images and replaced them with a Launch Screen, which causes the app to at least not run in the letterboxed mode anymore. However, when I open each view (XIB file) Interface Builder is mostly showing me a bunch of blue boxes with no detail in them where my UI elements should be. I made sure that the Opens In and Builds For settings are correct, and also checked Use Trait Variations and Use Safe Area Layout Guides.

I also tried creating a new view from scratch, but I ran into another problem: Interface Builder won't let me drag new UI elements into the main View as subviews. It only lets me drop them as new top-level views. I can copy and paste the view where I want it, but Autolayout appears to be disabled: I can't make any constraints.

It seems like there must be some global setting that is preventing the app from behaving like a modern app, but I can't figure out what it is.

Thanks,
Frank

Replies

I was able to successfully create a new View that appears to behave normally with respect to Autolayout, but when I try to copy elements from my old views into it, there are problems:

First, the elements appear as white boxes with a blue border, with no visible content.

The copied elements themselves appear to have Autolayout disabled. I can add constraints to them, which then sets their layout to Constraints, but this does not fix their appearance.

Furthermore, even after adding good constraints, the position and size of the pasted elements doesn't change. I can't refresh the view in Interface Builder.

Please tell me there's something simple I can do to fix this. I really don't think it's fair that I would have to start over from scratch and build every UI element again by hand in a new project. The rest of my app works fine, it's just the views that need updating. I'm willing to do the work to add all the constraints, but if I have to actually start over with a new project and recreate each UI element by hand, it will be hundreds of hours of work.

Thanks,
Frank
OK, so I started down the road of just creating a new View from scratch, copying nothing from the old view.

I added three elements - A label, a button, and an image view, and set up the constraints. As I adjusted the last constraint, the Interface Builder view suddenly blanked out. All the subviews are now grey rectangles with a blue border, and even the shape of the top view has changed to a rectangle and no longer responds to changes in the Device selection.

Either this is some serious bug in Interface Builder or else it is due to something, some setting somewhere, in my old project that I can't see or control. This is really turning into a big problem for me. As it stands, I can't even rebuild my views from scratch.

I'm really stuck. Please help.
Interface Builder actually crashed. I didn't notice it until now.

There's a whole crash report with a backtrace, but the core problem seems to be:

"scale must be > 0"

Should I post the rest of the error?
Update: I tracked the problem down to images. Because it is very old, the project has images in the bundle that are not part of an Image asset. While the images still work when the app runs, Interface Builder fails to load them. After I moved the images to an Asset and updated all the UI elements that use them, the regular appearance of the elements was restored.

There is still one minor issue, though. I can't get Interface Builder to show me the layout on different devices. No matter which device I pick, I'm seeing a rectangular view that looks like an iPhone 5. I'd like to figure out what causes this. The problem does not occur if I create a new view from scratch, but I'd much rather start with my current views.