如下图，我有一个需求。在启动页（LaunchScreen.storyboard）和引导页（GuideView）的黑色背景上，使用了同一张正方形图片。要求从启动页切换到引导页时，这两张相同的图片的过渡要无缝衔接，就是要求两图的位置约束一摸一样。

注意：图片的顶部是相对安全区域来进行约束的，并不是固定的某个高度。

问题就在于，启动页（LaunchScreen.storyboard）是一个静态页面，无法通过代码是适配不同设备的顶部安全区域高度。

具体来说，iPhone X之前的设备LaunchScreen.storyboard中的顶部Safe Area的高度会是0。这就意味着，在LaunchScreen.storyboard中若是相对Safe Area约束图片的话，我们会丢失一个20px的状态栏高度。

所以，如下图，对于UIImageView我们不能直接相对Safe Area来约束顶部位置。而是应该添加一个UIView，将UIView约束为Safe Area一样的大小，将UIImageView相对于UIView来约束顶部位置。

注意：约束UIView的底边时，选中UIView是无法相对Safe Area的顶部约束的。这里，我们需要选中Safe Area，然后约束到UIView的距离。

如下图，按照前面这样约束，我们会发现还是同样的问题。在iPhone X之前的设备，会丢失一个状态栏的高度20px，会导致启动页上这张图片会比引导页上的图片偏上20px.

如下图，为了解决上面的问题，我们还需要将UIView的顶部约束添加为20px. 图中，红色区域部分将会在iPhone X以下的设备消失。