上面那篇文章是中文版,而且下面还有三个带中文字幕的视频,从设计、编码和原理三个角度告诉你怎么样是适配 iPhone X。注意,Designing for iPhone X 这个视频,一般的设计师是看不懂的,所以这个视频虽说是设计知识,但是其实是给开发人员看的。所以最好是我们开发人员看了讲给 UI 设计师听,告诉他们怎么适配。
如果你是第一次下载 Xcode 9,运行起来,APP 并没有完全填充整个模拟器,这时你需要 UI 设计师给你切一张新的启动图,图片尺寸应该和 iPhone X 一样,iPhone X 的屏幕尺寸为 375 * 812 pt,记得 iPhone X 的屏幕是 @3x 的。
这里还有一个细节,拿到这张 iPhone X 启动图以后在你的项目里找到 Assets.xcassets 里的 LaunchImage,但是并没有放 iPhone X 启动图的位置,此时,你应该先把之前的启动图复制一份,然后将旧的 LaunchImage 删除,然后右键重新建立一个 LaunchImage,此时,你就可以看到 iPhone X 启动图的位置了。
03.启动页广告设计
之前所有的广告页面设计都是按照 iPhone 6s 的屏幕标准来设计的,这在没有 iPhone X 的时代是没有问题的。现在有了 iPhone X,它的屏幕比例不是 16 :9,所以这个广告页面放到 iPhone X 上就会出现左右被裁掉。但是如果按照 iPhone X 的屏幕来设计,就会导致在非 iPhone X 上显示出现上下被截掉的情况。
因此我们采取的方法是,仍然使用 iPhone 6s 的屏幕来进行设计,只是设计师注意在左右留出一部分距离,保证在 iPhone X 上显示把左右裁掉一部分以后依然能够正常显示。
其实文档里有写这个属性的注释: If the view is not currently installed in a view hierarchy, or is not yet visible onscreen, the edge insets in this property are 0. 假如当前 view 没有布局到窗口的中,这个值就是 0。