iPhone X上市了！看这分辨率，真爽；看这全面屏，真爽；看这刘海，真丑！乔布斯的棺材板要按耐不住了。iPhone X虽然充满槽点，依旧阻挡不了国人的热情，5秒售磐？！所以，最终结果是，全公司都没有给我这个小开发配一台测试机，然后我们的产品过来了：亲，我们的APP也要适配iPhone X噢～。（心里想着不给手机不做适配）

        唉，没有拿到第一批iPhone X，但是我们还有Xcode 9啊哈哈哈哈，写个小Demo模拟器上用iPhone X跑一遍，找一找用StoryBoard做适配的感觉。先上两张图对比一下，在iPhone 8 和iPhone X的情况下label的显示效果：

iPhone8 iPhoneX

开始修改适配iPhone X

        首先是一开始跑在iPhone 8 上的Demo，没有在启动页添加一张适配X的启动图（1125x2436@3x）时候，在X上的页面就会显示大额头和大下巴，所以

        第一步是使用LaunchScreen.xib 或者 LaunchScreen.storyboard 进行配置启动图，图片的尺寸是1125x2436@3x，然后在X上的启动后会自动满屏了。

启动页

        接下来，看一看页面的适配：分别做了几个测试，主要是测试顶部和底部关于安全区的适配问题。正常情况下，我们想要添加一个label在页面上，在X没出来之前，所有页面的顶部的高度都是64，然而在X的屏幕上，顶部的高度变成了88，所以之前我们偷懒写死控件距离顶部的约束都是64的坑就出来了。没办法，现在就要一个一个页面去检查了。

        之前我们设置一个控件的约束都是距离顶部view的，随着Xcode9的出来，设置约束的页面出现了一个safe area（跟着X一起出现的安全区）；就是我们用storyboard做适配的时候，基于safe area就会自动帮我们在所有机型上完成适配了。看图

距离顶部的约束

        这样设置顶部的约束后，在所有机型上就会自动显示在topbar下面，如果我们把顶部的约束写死成64，在iPhoneX上就会被导航栏遮挡了，在其他机型上正常显示。如果写死成88，在iPhoneX上刚好显示出来，但是在其他机型上就会往下偏移（当然，你用代码布局的话不需要考虑这么多）。

相对与底部也一样，因为iPhoneX底部多了home条，所以我们做底部的适配也要避免被home条遮挡的问题。IphoneX以前的机型，我们做底部的的约束可以设置距离View的约束为0，但是在iPhoneX上，再设置距离View的约束为0，则会被遮挡了，像这样：

底部约束 距离View

       当然，距离View的约束也可以设置为20，这样控件会往上偏移。如果修改成距离safe Area的话，在每个机型上，就会自动帮我们做好适配了，不必再担心被home条遮挡的问题。

距离safe area

总结一下

iPhoneX发布后，很想要，很想用，公司就是穷，不给你配置。所以，在模拟器上摸索了一下用storyboard自动布局，效果真的溜得飞起。可能以后习惯了storyboard，你会发现UI设计其实也挺好玩的。乱七八糟写了一点适配的心得，希望能帮到大家。