How To Solve The Most Common Interface Problems When Adapting Apps UI For iPhone X

No coding required!

Lee Kah Seng
5 min readOct 12, 2017
Handle iPhone X screen aspect ratio correctly.

In less than 1 month, iPhone X will be released to the market. Apple fans around the world can’t wait to get their hands on this beautiful looking smartphone. As a developer, adapting your apps to support the iPhone X edge-to-edge screen is a task that cannot be ignored.

In this article, I will show you a few common UI problems you might encounter when running your existing apps on iPhone X and how you can solve it with just a few simple tweaks using just interface builder.

Do note that the problems that we are going to discuss usually happen when trying to run Xcode 8 or lower projects on Xcode 9. However, the concept behind each solution will still be very useful when creating new apps using Xcode 9. Without further ado, let’s get started!

Problem 1: UI Elements Mispositioned Below Status Bar or Home Indicator

Labels being mispositioned below status bar and home indicator.

Image above shows a very common UI problem when we try to run our apps on the new iPhone X. For now, let’s focus on Label-A. The reason of the problem…

--

--

Lee Kah Seng
Lee Kah Seng

Written by Lee Kah Seng

Support me by becoming a Medium member: https://leekahseng.medium.com/membership ⦿ 🇲🇾 Creator of https://swiftsenpai.com ⦿ iOS developer since 2011

Responses (10)