How to prepare your App for the new iPhone X ?
technology

Know if Your App is Ready for the new iPhone X?

App developers better gear up because their App need a whole lot of revamping to shine on the new iPhone X

Know if Your App is Ready for the new iPhone X?

The latest iPhone X is trending as the “need of the hour” and almost all apps need a revamp to keep up with the trending technology. In Apple’s defence, it did remind developers to update their apps, prior to the launch of iPhone X. While many have challenged its infamous Face ID technology, the tech giant is doing its best by all possible means such as acquiring new startups, adding new AR features as it brings new innovations to please its loyal users. Considering the hype and the controversies around it, Apple was under a great deal of pressure to not disappoint its mobile users. Naturally, with Apple’s revamped App Store, the launch of iOS 11 and the brand new iPhone X, things are about to change.

Is your App ready for this change? Let’s find out:

1. Basics

In order to make the most of the Full-Screen Display Mode on iPhone X, developers will need to use Xcode 9 to build your app with iOS 11 SDK. Xcode 9 includes Swift 4 and SDKs for iOS 11, watchOS 4, tvOS 11, and macOS High Sierra 10.13.

2. Launch Images will be replaced by launch storyboard

Developers can still continue with launch images, in order to avoid running your app in letterbox, its best to switch to launch storyboard or add one for new iPhone X dimensions.

{IRP}

3. Stick to the safe areas

  • UI displays can make or mar an App on iPhone X. To make sure no elements of UI displays are clipped, mispositioned, incorrectly scaled or overlapping, use Apple’s safe area guides and layout margins to find out any such issues. The safe areas also help in the layout of your content.

  • The tool helps you find out which portion of the view is not covered by navigation bars, tab bars, toolbars, and other ancestor views by highlighting those uncovered sections when your app view is displayed on the screen.

  • The safe areas can also be added to multiple views which comes handy when you need to constrain some view to edges of the screen. The guide serves as one of the primary tools that helps your app adjust to the new iPhone X.
  • Developers must know that safe area layout guides are backward compatible up to iOS 9 which means you need to say goodbye to iOS 8, if you’re aiming for compatibility with iPhone X dimensions.
  • Hunt your STORYBOARDS AND XIBS and adjust them to safe areas. In order to do this, go through each of your xib or storyboard in Xcode 9, and choose the option of Safe Area Layout Guides. This will replace not only your top and bottom layout guides but also the leading and trailing edges with safe area layout guides. Wrap it up with a smoke test after each adjusted screen to make sure it's working well.

Stick with Updates

4. Tend to the TableView

While the UITableView itself will run edge to edge, the contentView of your UITableViewCell is constrained by the safe area. In case you want to make any changes, you can use the new UITableView.insetsContentViewsToSafeArea setting provided by iOS 11.

5. Be careful of the bottom of the screen

  • Avoid placing controls at the bottom of the screen. In case your app uses custom controls, make sure they’re in the safe areas. As for superviews, it's best to constrain them to the edge of the screen.
  • Avoid placing swipe up gestures from the bottom of the screen as Apple has reserved the bottom area for the virtual home button indicator.

6. Native components will be taken care of by Apple

The layout of native components in an App such as UITableView, UINavigationBar or UITabBar, will be automatically adjusted for the iPhone X.

7. Don’t forget the Landscape mode

While you may have fixed all the issues cropping in portrait mode, make sure you’ve doubled checked those issues as a majority of them are likely to appear in landscape mode. Make sure you test all of your UI with the device rotated, both to the left and to the right.

{IRP}

8. Unlock the bolder navigation bar

The navigation bar in iOS 11 is using Auto Layout and the fonts are bigger and bolder. Although, the setting is disabled by default if you want to provide a content rich experience in your Apps, enable the setting to automatic.

Navigation Bar in iPhone X

9. Unification of the navigation and search bar

Now that Apple has unified the navigation and the search bar, you don’t want to be the only one with an abrupt non-unified search bar looks bad on an iPhone X. How can you fix this?

I assume this is what you have at the moment.

Specification in iPhone X

Use this code to fix it

Unification of iPhone X

10. Finally

Before you submit your App to the App Store, get it reviewed by Test Flight Beta Testing. Once you’ve incorporated all the valuable feedback, its time to update your PRODUCT PAGE. For step-by-step instructions how to submit your apps for distribution on the App Store, see the iTunes Connect Developer Help.

Good Luck!!

For the Latest Mobile App Trends and Mobile App Reviews, follow MobileAppDaily on TwitterFacebookLinkedInInstagram and Flipboard.

MAD Team
Written By

MobileAppDaily host a team of experienced technical writers, industry wizards, and app experts who have an exact knack of content that caters to the needs of the mobile app targeted audience. We strive to bring you the best of tech!

Top Companies

InMobi
Singapore
Dot Com Infoway
New York, USA
M&C Saatchi Mobile
New York City, USA
Techmagnate
New Delhi, India
Fetch
London, UK
View full report

Latest Articles

Join our global community 135K Followers
technology

iOS 11.3 Beta Release: Information on Improving Battery Health

MAD Team 4 min read  

As a step further in order to improve the battery life performance on its device, Apple has introduced a new screen in the iOS 11.3 beta 2 settings known as Battery Health (Beta). The settings are available for all iPhones since iPhone 6. The settings include information on capacity (maximum) of the

technology

Google Is Adding "Who Viewed Your File" Activity Dashboard To G Suite

MAD Team 4 min read  

Google announces a new update for its G suite users that will add a new activity Dashboard to the files. The new feature will enable the users to check who has viewed the shared doc, sheet or slide along with the time of accessing it. This means, now you can know whether your shared file has been vi

technology

Apple Celebrates World Emoji Day With Memoji Avatars

MAD Team 4 min read  

Apple could be the world's most valuable company, but it knows how to connect with its users and employees. The iPhone maker is known for celebrating every small and significant occasion with its unique approach. At this year’s World emoji day, i.e., today, Apple again did something differ

technology

Google Revealed Another Security Vulnerability In Microsoft Edge

MAD Team 4 min read  

Google once again publicly discloses a security vulnerability in the Microsoft's product. Both the tech giants share quite a history when it comes to the security vulnerability disclosure. Microsoft and Google are in the continuous rivalry for last 10 years by pointing out the flaws in each othe