How iOS Apps Adapt to the iPhone XS Max and iPhone XR Screen Sizes

iPhone X Reference

As a reference, here’s how an Xcode 9/ iOS 11 app appears on the iPhone X at its native resolution:

Xcode 9 / iOS 11 build of Adaptivity running on iPhone X simulator running iOS 11 in portrait
Xcode 9 / iOS 11 build of Adaptivity running on iPhone X simulator running iOS 11 in landscape

Xcode 9 / iOS 11

Apps that were built with Xcode 9 (i.e. targeting iOS 11) are unaware of the existence of the iPhone XS Max screen size. The same Xcode 9 / iOS 11 app running on the new iPhone XS Max (or iPhone XR) is simply zoomed to fill the larger screen:

Xcode 9 / iOS 11 build of Adaptivity running on iPhone XS Max simulator running iOS 12 in portrait
Xcode 9 / iOS 11 build of Adaptivity running on iPhone XS Max simulator running iOS 12 in landscape

Xcode 10 / iOS 12

When built with the Gold Master version of Xcode 10, apps see the true nature of the iPhone XS Max and iPhone XR screens:

Xcode 10 / iOS 12 build of Adaptivity running on iPhone XS Max simulator running iOS 12 in portrait
Xcode 10 / iOS 12 build of Adaptivity running on iPhone XS Max simulator running iOS 12 in landscape
Xcode 9 / iOS 11 build of Adaptivity showing a Split View Controller running on iPhone 8 Plus simulator running iOS 11 in landscape
Xcode 10 / iOS 12 build of Adaptivity showing a Split View Controller running on iPhone XS Max simulator running iOS 12 in landscape

Conclusion

As should now be expected, Apple have designed the iPhone XS Max, iPhone XR and iOS 12 to behave in a backwardly-compatible manner for apps that were built with Xcode 9 and can’t reasonably be expected to be able to fully support the new devices. Even apps that use auto layout and have launch storyboards will be shown zoomed to fill the larger screen. Rebuilding with Xcode 10 opts the developer into the larger screen size.

How Did I Run Xcode 9 / iOS 11 apps on iOS 12 Simulators?

You might be wondering how I was able to capture screenshots from the Xcode 10 / iOS 12 simulators with apps built with Xcode 9. My earlier article iPad Navigation Bar and Toolbar Height Changes in iOS 12 explains the process in the Wait, What Did You Say? section.

Adaptivity iOS App

The screenshots in this article were taken from the iOS simulator running my Adaptivity iOS app. Adaptivity is a tool for developers and designers to visualise the different screen sizes, layout margins, readable content guides, bar heights and Dynamic Type sizes that a modern, adaptive, iOS app uses when running on different devices and iPad multitasking sizes. More screenshots and information on all the features is available on my web site.

Other Articles That You Might Like

There is an iPhone-only version of Adaptivity to show How iPhone-only Apps Appear on iPad (it changed in iOS 12).

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Geoff Hackworth

Geoff Hackworth

1.1K Followers

Independent and freelance software developer for iPhone, iPad and Mac