Update your apps for iPhone X.
iPhone X features the stunning 5.8-inch Super Retina display, enabling even more immersive app experiences. Start testing your apps now to make sure they are ready to take advantage of the Super Retina display by respecting safe areas, supporting adaptive layouts, and more.
Run and Test in Simulator
Download the latest version of Xcode 9 and start testing your app in Simulator today. Find and address UI issues in your app before testing on a device to make sure your app looks great on iPhone X.
Enable full screen native resolution. Your app will run in Full Screen Display Mode on iPhone X if your project’s base SDK is set to iOS 11 and you have a Launch Storyboard or iPhone X launch image.
Verify all parts of your app. Make sure that your UI displays correctly and no elements are mispositioned, overlapping, incorrectly scaled, or clipped. If you discover issues, use the safe area guides and layout margins to correctly position UI elements.
If only parts of your app run in Simulator — for example, if it mostly uses UIKit, but has camera integration — you should test as much of your UI as possible by commenting out views that Simulator doesn’t support. For details on using Simulator and on the technologies that it supports, see Simulator Help.
-
Download Xcode 9
Xcode 9 includes the latest SDKs for iOS 11 and the iPhone X simulator.
Respect Safe Areas
Your layout should fill the all-screen Super Retina display while content and controls appear correctly and are easily tappable. Use these safe areas to make sure your app works properly with the new dimensions of iPhone X.
Apps with custom layouts can also easily support iPhone X, especially if your app uses Auto Layout and adheres to these guidelines.
Status bar. Allow the proper amount of space below the status bar based on the safe area. Avoid assuming a value for the status bar height, as it may cause your content to be obscured or mispositioned below the status bar.
Rounded display corners and sensor housing. Keep content and controls away from the corners and sensor housing to allow your app to fill the screen without getting clipped.
Home Indicator. Make sure your app doesn’t interfere with Home Indicator, so your content and controls remain clearly viewable and tappable at all times.
Screen Edge Gestures. The display on iPhone X uses screen edge gestures to provide access to Home screen, app switcher, Notification Center, and Control Center. Avoid interfering with these gestures. Move controls into the safe area and adjust your UI. In rare cases, you may consider using edge protect, in which the first swipe invokes the app-specific gesture and a second-swipe invokes the system gesture.
Support Various Aspect Ratios and Orientations
The screen height and aspect ratio of iPhone X is different from other iPhone devices. In portrait orientation, the width of the display on iPhone X matches the width of the 4.7" displays of previous models. However, the display on iPhone X is 145 points taller than a 4.7" display.
-
Documentation
Check that your code handles a different screen aspect ratio. Many apps position content based on a particular width, height, or aspect ratio. Verify that your content scales and is positioned correctly.
Test your app in landscape orientation. While you may discover some issues in portrait orientation, the majority of issues will likely appear in landscape orientation. Be sure to test all of your UI with the device rotated, both to the left and to the right.
Scale videos accordingly. Video content on iPhone X should fill the display. However, if this results in any cropping on the top or bottom, or too much cropping on the side, the video should be scaled to fit the screen. While AVPlayerViewController manages this automatically, custom video players based on AVPlayerLayer need to select an appropriate initial video gravity setting and allow users to switch between aspect and aspectFill viewing modes based on their preference.
Learn more in the Human Interface Guidelines
Update for Face ID
Verify your Touch ID code works for Face ID. If your app currently uses Touch ID, update text strings to refer to Face ID when running on iPhone X — for example, “Sign in with Face ID.” Avoid using icons to represent Face ID and Touch ID.
Essential Videos
Learn how to update your app’s design and code to work seamlessly with iPhone X with the detailed information in these videos.
Face ID and your Apps
One of the most advanced features of iPhone X, Face ID is a secure biometric authentication technology that lets users easily unlock, authenticate, pay, and quickly access your app with just a glance. While it has many similarities to Touch ID, there are a few key differences. Learn more about Face ID and how to successfully implement it in your apps.
Designing for iPhone X
Learn about the all-screen Super Retina display, which provides more space to display content and create deeply immersive experiences. Learn how to design your app or game to look and feel great on iPhone X.
Building Apps for iPhone X
Learn how to make changes in your app to accommodate the new screen size and rounded corners. Learn about common pitfalls and see how you can take advantage of safe areas and layout guides in iOS 11 to make sure your app looks great on iPhone X.
Updating Your App for iOS 11
iOS 11 brings a bold, dynamic new style to UI elements systemwide. Learn how to adopt new features in your app, including large title bars with integrated search, landscape tab bars, and more powerful swipe actions. Explore new patterns and enhancements that make it easier than ever to craft the perfect experience for your users.
Modern User Interaction on iOS
Touch interactions are fundamental to the user experience on iOS. Learn how to master the power of the UIKit gesture recognizer system in your app on iPhone X.
Auto Layout Techniques in Interface Builder
Auto Layout lets you easily create robust layouts for your app that are especially helpful when adding support for iPhone X. Get details on new and existing techniques for building layouts in Interface Builder. Learn how to build more dynamic layouts and handle state changes using priorities and size classes. Find out how iOS 11 support for dynamic type and safe areas can ensure your content can be viewed by anyone.