[分享]三分钟弄懂iPhoneX设计尺寸和适配

[科普]本篇是关于iPhoneX设计尺寸和适配的帖子！

今年发布新机中，只有iPhone X的分辨率发生了变化，但变化仅限于物理像素层面。在真正决定屏幕内容的逻辑像素层面，新版的iPhone X与过去我们熟知的iPhone 4.7''、iPhone 5.5'' 放大模式宽度相同。通俗的说，iPhone X可看做是iPhone 4.7'' 的加长版

无聊

然而，事情并不是设计图加长这么简单。
过去，我们拿到的手机是方方正正的矩形，所以整个屏幕都可以看做是安全区域Safe Area，而如今由于iPhone X屏幕上的“刘海”以及屏幕四周采用圆角的设计，需要设计师对绘图区域做出调整。苹果给出的安全区域如下
页面内容不能超出安全区域（Safe Area）
避免将触发交互行为的按钮放在屏幕的底部，人们会在屏幕底端使用手势进入主屏或切换应用。（底部横条是Home键）

快更，别墨迹！

就代表x屏幕尺寸还没有plus大

值得注意的是，iPhone X 底部操作栏目进行了细微的放大。除了常见的底部导航栏外，Safari底部操作栏也有放大
讲完竖屏，再说横屏。
和竖屏一样，横屏的内容也要放置在Safe Area中

然后呢

这样可用面积真是少得可怜

避免将触发交互行为的按钮放在屏幕的角落中。人们会在屏幕底端使用手势进入主屏或切换应用。这些系统的全局操作优先于App的操作。如果把功能放在角落里，用户操作起来也很费劲，尽量在用户手指可及区域内设计功能

厉害了

最后说下最核心的问题，Safe Area 范围有多大？如下：

加精了