How can Xcode 6 adaptive UIs be backwards-compatible with iOS 7 and iOS 6?

Solution 1:

Changes made to the UI with Size Classes in Interface Builder DO appear correctly on iOS 7 devices and the Preview in Xcode. For example, I changed some Auto Layout constraints and font sizes for Regular height Regular width and those changed constraints are visible in the iPad Simulator running iOS 7.0.

All size class optimizations are made available to iOS 7, except size classes that have a Compact Height. This has been confirmed by Apple and is now stated directly in the documentation:

For apps supporting versions of iOS earlier than iOS 8, most size classes are backward compatible.

Size classes are backward compatible when:
- The app is built using Xcode version 6 or later
- The deployment target of the app is earlier than iOS 8
- Size classes are specified in a storyboard or xib
- The value of the height component is not compact

Because iOS 7 doesn't respect a couple of size classes, if you use them you'll run into issues. For example: When you have Compact w Any h defined and then Compact w Compact h defined, on iOS 7 it will respect the Compact w Any h but on iOS 8 it renders the Compact w Compact h appearance.

So, if you would like to utilize those two size classes and maintain compatibility with iOS 7, I would do any optimizations you desire for iPhone in landscape in Any w Any h or Compact w Any h, then perform your other optimizations for different size classes as necessary, and that way you won't need to use any size class with compact height and will avoid running into issues.

Solution 2:

When deploying your app to iOS 7, Xcode will compile your storyboard in two different ways:

• For iPhone, your storyboard gets compiled as "Compact-Regular" (Compact width, regular height), and this gets packaged as your "~iphone" nib.

• For iPad, your storyboard gets compiled as "Regular-Regular" and gets packaged as your "~ipad" nib.

So if you're looking to deploy to both iOS 7 and iOS 8, you should focus your design on the Compact-Any and Regular-Any size classes. That will give you the best experience in terms of matching the UI across deployment targets. You are, of course, welcome to modify the layout for other size classes, but unless those modifications would get applied to the Compact-Regular or Regular-Regular size classes, then you would not see those modifications on iOS 7.

Solution 3:

Note: This answer was relevant to a beta version of Xcode 6 and is no longer applicable to the shipping version. See answers by Joey and Dave DeLong on this page for proper information.

(original answer retained below):

While Storyboards/XIBs configured to use size classes will run on iOS 7, the OS does not currently respect those size classes and appears to use the default 'Any/Any' size class.

I agree that the particular slide you are referring to seems to promise such compatibility, but it doesn't appear to be the case currently (Xcode 6 beta 2).

To test, I created a project (iOS 8 SDK, deployment target of 7.1) with a single button that is centered vertically and horizontally in the Any/Any size class, but aligned to the top left corner in the Compact/Compact size class (e.g. iPhone in landscape). Xcode's Preview Assistant shows that the button changes its position in iOS 8, but not iOS 7. I confirmed this behavior on an iOS 7 device as well.