iPhone X设计规范。

苹果官方设计规范视频连接：

https://developer.apple.com/videos/play/tech-talks/801/

iPhone X.

iPhone X包括一个大型，高分辨率，圆润，边缘到边缘的Super Retina显示屏，提供前所未有的沉浸式，内容丰富的体验。

屏幕尺寸

在纵向方向上，iPhone X上显示屏的宽度与iPhone 6，iPhone 7和iPhone 8的4.7英寸显示屏的宽度相匹配。然而，iPhone X上的显示屏比4.7英寸显示屏高出145pt，导致大约20％的额外垂直空间用于内容。

为您应用中的所有艺术作品提供高分辨率图像。iPhone X拥有高分辨率Super Retina显示屏，比例因子为@ 3x。对于字形和其他平面矢量图稿，最好提供与分辨率无关的PDF。对于栅格化图稿，请提供图稿的@ 3x和@ 2x版本。请参阅图像大小和分辨率和自定义图标。

布局

在为iPhone X进行设计时，您必须确保布局填满屏幕，并且不会被设备的圆角，传感器外壳或访问主屏幕的指示器遮挡。

大多数使用标准的，系统提供的UI元素（如导航栏，表格和集合）的应用程序会自动适应设备的新外形。背景材料延伸到显示器的边缘，并且UI元件被适当地插入和定位。

对于具有自定义布局的应用，支持iPhone X也应该相对容易，特别是如果您的应用使用自动布局并遵守安全区域和边距布局指南。

在iPhone X上预览您的应用程序。您可以使用模拟器（Xcode附带）来预览您的应用程序并检查裁剪和其他布局问题。如果您的应用支持横向模式，请确保您的布局看起来很棒，无论设备是向左还是向右旋转。iPhone X不支持倒置纵向模式。某些功能（如宽彩色图像）最适合在实际设备上预览。

提供全屏体验。确保背景延伸到显示器的边缘，并且垂直可滚动的布局（如表和集合）一直延伸到底部。

插入必要内容以防止剪裁。通常，内容应居中且对称插入，以使其在任何方向看起来都很好，并且不会被角落或设备的传感器外壳夹住，或被访问主屏幕的指示器遮挡。为获得最佳效果，请使用标准的，系统提供的界面元素和自动布局来构建界面。应用程序应遵循UIKit定义的安全区域和布局边距，以确保根据设备和上下文进行适当的插入。安全区域还可以防止内容状态栏，导航栏，工具栏和标签栏中的内容。

当设备处于横向时，某些类似应用的游戏可能适合在屏幕的下半部分（延伸到安全区域下方）放置可点击控件，以便为内容留出更多空间。在屏幕顶部和底部放置控件时使用匹配的插入，并在Home指示器周围留出足够的空间，以便人们在尝试与控件交互时不会意外地将其作为目标。

请注意状态栏高度。iPhone X上的状态栏比其他iPhone更高。如果您的应用假设状态栏高度为状态栏下方的定位内容，则必须更新您的应用以根据用户的设备动态定位内容。请注意，当语音录制和位置跟踪等后台任务处于活动状态时，iPhone X上的状态栏不会更改高度。

如果您的应用程序当前隐藏状态栏，请重新考虑iPhone X的决定.iPhone上的显示高度为内容提供了比4.7“iPhone的显示更多的垂直空间，并且状态栏占据了您的应用可能赢得的屏幕区域”充分利用。状态栏还显示人们认为有用的信息。它只应隐藏以换取附加值。

在重用现有艺术作品时，请注意宽高比差异。iPhone X具有与4.7“iPhone不同的宽高比。因此，当在iPhone X上全屏显示时，全屏4.7”iPhone图片会出现裁剪或信箱。同样，全屏iPhone X图稿在显示时会出现裁剪或柱形框在4.7英寸iPhone上全屏显示。确保在两种显示尺寸上都能看到重要的视觉内容。

避免将交互式控件明确放置在屏幕的最底部和角落中。人们使用显示屏底部的滑动手势来访问主屏幕和应用切换器，这些手势可能会取消您在此区域中实现的自定义手势。屏幕的远角可能是人们舒适地到达的困难区域。

插入全宽按钮。延伸到屏幕边缘的按钮可能看起来不像按钮。尊重全宽按钮两侧的标准UIKit边距。当屏幕底部出现圆角并与安全区域的底部对齐时，屏幕底部出现的全宽按钮效果最佳 - 这也确保它不会与Home指示灯冲突。

请勿掩盖或特别注意按键显示功能。不要试图通过在屏幕的顶部和底部放置黑条来隐藏设备的圆角，传感器外壳或用于访问主屏幕的指示器。不要使用括号，边框，形状或教学文本等视觉装饰来特别注意这些区域。

允许自动隐藏指示器以便谨慎访问主屏幕。启用自动隐藏后，如果用户未触摸屏幕几秒钟，指示灯会淡出。当用户再次触摸屏幕时，它会重新出现。应仅针对播放视频或照片幻灯片等被动查看体验启用此行为。

请参阅适应性和布局。

颜色

iPhone X上的显示屏支持P3色彩空间，可以产生比sRGB更丰富，更饱和的色彩。

使用宽色来增强视觉体验。使用宽色的照片和视频更逼真，使用宽色的视觉数据和状态指示器更具影响力。

视频

系统提供的视频播放器提供两种查看模式：全屏（纵横填充）和适合屏幕（纵横比）。默认情况下，系统根据视频的宽高比选择查看模式，用户可以在播放期间切换模式。有关开发人员指导，请参阅AVPlayerViewController。

全屏（纵横填充）查看模式。视频缩放以填充显示。可能会发生一些边缘裁剪。这是宽视频的默认查看模式（2：1到2.40：1）。有关开发人员指导，请参阅resizeAspectFill。

适合屏幕（纵横）观看模式。整个视频在屏幕上可见。将发生信箱或邮筒。这是标准视频（4：3,16：9，以及最高2：1的任何内容）和超宽视频（任何高于2.40：1）的默认查看模式。有关开发人员指导，请参阅resizeAspect。

4：3视频

16：9视频

2：1视频
21：9视频

确保自定义视频播放器的行为符合预期。目标是在iPhone X上播放视频内容时默认填充显示。但是，如果填充显示导致裁剪过多，则应缩放视频以适合屏幕。您还应该允许用户根据个人喜好在全屏和适合屏幕查看之间切换。有关开发人员指导，请参阅AVPlayerLayer。

始终以原始宽高比显示视频内容。如果您的视频内容使用嵌入式信箱或邮箱填充符合特定宽高比，则iOS将无法根据用户选择的查看模式正确缩放视频。嵌入在视频帧中的填充可以使视频在全屏模式和适合屏幕模式下显得更小。它还可以防止视频在边缘到边缘的非全屏幕环境中正确显示，例如iPad上的画中画模式。

填充4：3视频的结果

填充21：9视频的结果

手势

iPhone X上的显示屏使用屏幕边缘手势来访问主屏幕，应用程序切换器，通知中心和控制中心。

避免干扰系统范围的屏幕边缘手势。人们依靠这些手势在每个应用程序中工作。在极少数情况下，像游戏这样的沉浸式应用程序可能需要优先于系统手势的自定义屏幕边缘手势 - 第一次滑动调用特定于应用程序的手势，第二次滑动调用系统手势。应谨慎实施此行为（称为边缘保护），因为这会使人们更难以访问系统级操作。有关开发人员指导，请参阅UIViewController的preferredScreenEdgesDeferringSystemGestures（）方法。要了解有关系统手势的更多信息，请参阅手势。