How iOS Apps Adapt to the various iPhone 12 Screen Sizes

Over the last few years I have written several articles showing how iOS apps built with different versions of Xcode would appear when run on iOS devices that didn’t exist when the apps were built. As a general rule, apps must build with the latest version of Xcode to opt in to seeing the native screen resolutions of new devices. Older apps would run on newer devices but appeared as letterboxed, pillar boxed and/or scaled versions of previous device sizes. This ensured that the old apps never ran at screen resolutions that didn’t exist when they were built.

In WWDC 2019: 224 Modernizing Your UI for iOS 13, the presenter discusses backward compatibility and stated:

In the past if we introduced new hardware with a new screen size, your apps were letterboxed. Well, we’re not going to be doing that anymore either. So, if you application is built against the iOS 13 SDK, then it will always be displayed at the native full-screen resolution of the screen.

I thought that meant I would never need to write another article in this series. The new iPhone 12 models do display apps at different resolutions depending on which Xcode version they were built with. Have Apple reversed that decision or does it only apply to new iPad resolutions?

At their October 2020 event, Apple announced four iPhone 12 models: iPhone 12 mini, iPhone 12, iPhone 12 Pro and iPhone 12 Pro Max. The iPhone 12 and 12 Pro have the exact same screen resolution as each other and behave identically. So there are only really three screen resolutions to consider.

iPhone 12 mini 5.4" with 1080×2340 pixels

iPhone 12 / 12 Pro 6.1" with 1170×2532 pixels

iPhone 12 Pro Max 6.7" with 1284×2778 pixels

None of these resolutions correspond to existing devices. The iPhone 12 mini has an extra surprise in store. Just like the iPhone 6+, 6S+, 7+ and 8+, an app running on the iPhone 12 mini renders at a different resolution to what is actually shown on screen.

Before examining the new devices it’s worth revisiting how some of the existing devices behave. I think the 2nd generation iPhone SE, 11 Pro and 11 Pro Max are the most appropriate models to compare against the new models. Unlike previous articles in this series, I also consider Display Zoom (for extra complexity and time making all these screenshots!)

2nd Gen iPhone SE

Standard Zoom

Xcode 12.1 build of Adaptivity on 2nd generation iPhone SE running iOS 14.1 in portrait
Xcode 12.1 build of Adaptivity on 2nd generation iPhone SE running iOS 14.1 in landscape

Display Zoom

Xcode 12.1 build of Adaptivity on 2nd generation iPhone SE running iOS 14.1 in portrait with Display Zoom
Xcode 12.1 build of Adaptivity on 2nd generation iPhone SE running iOS 14.1 in landscape with Display Zoom

iPhone 11 Pro

Standard Zoom

Xcode 12.1 build of Adaptivity on iPhone 11 Pro running iOS 14.1 in portrait
Xcode 12.1 build of Adaptivity on iPhone 11 Pro running iOS 14.1 in landscape

Display Zoom

Xcode 12.0 build of Adaptivity on iPhone 11 Pro running iOS 14.1 in portrait with Display Zoom
Xcode 12.0 build of Adaptivity on iPhone 11 Pro running iOS 14.1 in landscape with Display Zoom

The iPhone 11 Pro did not support Display Zoom on iOS 13. When built with Xcode 11 (i.e. linked against iOS 13), the iPhone 11 Pro with Display Zoom shows a zoomed up letterboxed (portrait) or pillar boxed (landscape) 1st generation iPhone SE resolution of 320×568 points. This ensures the app does not see a screen resolution that didn’t exist on iOS 13. The app thinks the status bar is 20 points tall (as on a real 1st generation iPhone SE) but iOS continues to put the time and other indicators at the very top of the screen.

Xcode 11.7 build of Adaptivity on iPhone 11 Pro running iOS 14.1 in portrait with Display Zoom
Xcode 11.7 build of Adaptivity on iPhone 11 Pro running iOS 14.1 in landscape with Display Zoom

iPhone 11 Pro Max

Standard Zoom

Xcode 12.1 build of Adaptivity on iPhone 11 Pro Max running iOS 14.1 in portrait
Xcode 12.1 build of Adaptivity on iPhone 11 Pro Max running iOS 14.1 in landscape

Display Zoom

Xcode 12.1 build of Adaptivity on iPhone 11 Pro Max running iOS 14.1 in portrait with Display Zoom
Xcode 12.1 build of Adaptivity on iPhone 11 Pro Max running iOS 14.1 in landscape with Display Zoom

iPhone 12 mini

Standard Zooom

Xcode 12.1 build of Adaptivity on iPhone 12 mini running iOS 14.1 in portrait
Xcode 12.1 build of Adaptivity on iPhone 12 mini running iOS 14.1 in landscape

Display Zoom

Xcode 12.0 build of Adaptivity on iPhone 12 mini running iOS 14.1 in portrait with Display Zoom
Xcode 12.0 build of Adaptivity on iPhone 12 mini running iOS 14.1 in landscape with Display Zoom

When built with Xcode 11, the iPhone 12 mini with Display Zoom shows the same zoomed up letterboxed (portrait) or pillar boxed (landscape) 1st generation iPhone SE resolution of 320×568 points as the iPhone 11 Pro with Display Zoom.

Xcode 11.7 build of Adaptivity on iPhone 12 mini running iOS 14.1 in portrait with Display Zoom
Xcode 11.7 build of Adaptivity on iPhone 12 mini running iOS 14.1 in landscape with Display Zoom

iPhone 12 / 12 Pro

Standard Zoom

Xcode 12.1 build of Adaptivity on iPhone 12 Pro running iOS 14.1 in portrait
Xcode 12.1 build of Adaptivity on iPhone 12 Pro running iOS 14.1 in landscape

Apps built with Xcode 12.0 or earlier will see a zoomed up iPhone 11 Pro resolution of 375×812 when run on the iPhone 12 or 12 Pro at its native resolution. This time the top and bottom bars are the same height as on an actual iPhone 11 Pro!

Xcode 12.0 build of Adaptivity on iPhone 12 Pro running iOS 14.1 in portrait
Xcode 12.0 build of Adaptivity on iPhone 12 Pro running iOS 14.1 in landscape

Display Zoom

Xcode 12.0 build of Adaptivity on iPhone 12 Pro running iOS 14.1 in portrait with Display Zooom
Xcode 12.0 build of Adaptivity on iPhone 12 Pro running iOS 14.1 in landscape with Display Zooom

When built with Xcode 11, the iPhone 12 and 12 Pro with Display Zoom show the same zoomed up letterboxed (portrait) or pillar boxed (landscape) 1st generation iPhone SE resolution of 320×568 points as the iPhone 11 Pro and iPhone 12 mini with Display Zoom.

Xcode 11.7 build of Adaptivity on iPhone 12 Pro running iOS 14.1 in portrait with Display Zooom
Xcode 11.7 build of Adaptivity on iPhone 12 Pro running iOS 14.1 in landscape with Display Zooom

iPhone 12 Pro Max

Standard Zoom

Xcode 12.1 build of Adaptivity on iPhone 12 Pro Max running iOS 14.1 in portrait

In landscape, note that the horizontal size category is regular (the same as the smaller iPhone 11 Pro Max).

Xcode 12.1 build of Adaptivity on iPhone 12 Pro Max running iOS 14.1 in landscape

Apps built with Xcode 12.0 or earlier will see a zoomed up iPhone 11 Pro Max resolution of 414×896 points at its native resolution. The bars are the same height as on the iPhone 11 Pro Max.

Xcode 12.0 build of Adaptivity on iPhone 12 Pro Max running iOS 14.1 in portrait
Xcode 12.0 build of Adaptivity on iPhone 12 Pro Max running iOS 14.1 in landscape

Display Zoom

Xcode 12.1 build of Adaptivity on iPhone 12 Pro Max running iOS 14.1 in portrait with Display Zoom
Xcode 12.1 build of Adaptivity on iPhone 12 Pro Max running iOS 14.1 in landscape with Display Zoom

Conclusion

Display Zoom usually shows a zoomed up version of a smaller existing device’s resolution. The exception is the iPhone X, XS and 11 Pro size which did not support Display Zoom until iOS 14. They show a new resolution of 320×693 points when built with Xcode 12 (i.e. against iOS 14) and a letterboxed 320×568 points when built with Xcode 11.

How Did I Run Xcode 11 / iOS 13 apps on iOS 14.1 Simulators?

Adaptivity

Testimonials, more screenshots and information on all the features is available on my web site.

Other Articles That You Might Like

I have written articles on Bringing Adaptivity to Mac Catalyst, How to Switch Your iOS App and Scene Delegates for Improved Testing, View Controller Presentation Changes in iOS 13 and the SF Symbols Changes in iOS 14.

I have also written about Working with Multiple Versions of Xcode and how to Hide Sensitive Information in the iOS App Switcher Snapshot Image.

If you found any of these articles helpful then please take a look at my apps in the iOS App Store to see if there’s anything that you’d like to download (especially the paid ones 😀).

If you work with a lot of Xcode projects you might like my Mac Menu Bar utility XcLauncher. It’s like having browser bookmarks for your favorite Xcode projects, workspaces, playgrounds, and Swift packages. There is more information on my website about XcLauncher’s features.

Independent and freelance software developer for iPhone, iPad and Mac