1. 全栈程序员必看首页

iPhone 检测 iPhone X 设备的几种方式和分辨率终极指南[通俗易懂]

全栈程序员-用户IM • • 未分类

本文是我们前两天发的两条小集的汇总，主要包括三部分：iPhone屏幕分辨率总结如何适配新的iPhoneX设备检测设备是否为iPhoneX/XS/XR的几种方式iPhone屏幕分辨率终极指南上周，苹果发布了三款新的iPhone设备，它们的屏幕数据分别如下：iPhoneXS:5.8英寸，375pt*812pt(@3x)；iPhoneXR:6.1…

大家好，又见面了，我是你们的朋友全栈君。

文章目录

本文是我们前两天发的两条小集的汇总，主要包括三部分：

  1. iPhone 屏幕分辨率总结
  2. 如何适配新的 iPhone X 设备
  3. 检测设备是否为 iPhone X/XS/XR 的几种方式

iPhone 屏幕分辨率终极指南

上周，苹果发布了三款新的 iPhone 设备，它们的屏幕数据分别如下：

  1. iPhone XS: 5.8 英寸，375pt * 812pt (@3x)；
  2. iPhone XR: 6.1 英寸，414pt * 896pt (@2x)；
  3. iPhone XS Max: 6.5 英寸，414pt * 896pt (@3x)；

在国外的 PaintCode 网站上，有一篇文章《The Ultimate Guide To iPhone Resolutions》整理了包括从第一代 iPhone 到最新发布的 iPhone XS Max 等所有 iPhone 设备的屏幕数据，包括：开发尺寸（points）、物理尺寸（pixels）以及实际渲染像素、1倍/2倍/3倍模式等，如图 1 所示（建议大图查看更加清晰）。
在这里插入图片描述

从图中数据我们可以总结以下几点：

  1. 5.8 英寸的 iPhone X/XS 与 6.1 英寸的 iPhone XR 和 6.5 英寸的 iPhone XS Max 的屏幕宽高比是一致的，约为 0.462；
  2. iPhone X/XS 的屏幕宽度（开发尺寸）与 4.7 英寸的 iPhone 8 相同，都为 375pt，只是在高度上增加了
    145pt；
  3. iPhone XR 和 iPhone XS Max 的屏幕宽度（开发尺寸）与 5.5 英寸 iPhone 8 Plus 相同，都为
    414pt，只是在高度上增加了 160pt；

因此，设计师在出图时，仍然可以以 iPhone 8 和 iPhone 8 Plus 的屏幕宽度为基准分别进行 UI 布局，而对于不同高度的屏幕只要在纵向上进行内容延伸即可。

适配新的 iPhone X 设备

此外，我们发现，对于未进行新屏幕尺寸适配的工程，直接编译，在新设备 iPhone XR 和 iPhone XS Max 上运行，它们是以放大模式自动适配的（以 5.8 寸的 iPhone X 屏幕为基准等比例放大），此时在代码中获取到的屏幕宽高都为 375pt * 812pt。

那么如何正确适配新的屏幕尺寸呢？

  1. 如果你的工程是以 LaunchScreen.storyboard 作为启动页，则只需要在 Xcode 10 下重新编译工程即可；
  2. 如果你的工程是通过配置 Assets.xcassets 里的 LaunchImage 不同尺寸的启动图片作为启动页，则你需要新增两张
    828px * 1792px 和 1242px * 2688px 分辨率的图片，如图 2 所示。
    在这里插入图片描述

检测 iPhone X/XS/XR 设备的几种方式

最后，我们如何在代码中判断当前设备是否为 iPhone X 呢？

备注：这里所说的 iPhone X 泛指上述介绍的屏幕大小为 5.8、6.1、6.5 英寸三种尺寸，且带有顶部刘海和底部操作条的 iPhone 设备。

一开始我们采用了一种比较简便的方法：通过获取屏幕的高度，判断是否等于 812.0 或 896.0，代码如图 3 所示。
在这里插入图片描述

但该方法存在小瑕疵，需要考虑一下两点：

  1. 当 App 支持横竖屏切换时，在横屏模式下也能够正确判断；
  2. 在模拟器中调试时，能够正确判断当前所选则的模拟器类型是不是 iPhone X；

因此，我们重新整理一下目前所了解到的几种检测设备是否为 iPhone X 的方式，供大家参考，不足之处欢迎补充。

方式一：通过获取设备的 device model 来判断

每一台 iOS 设备都有对应的硬件编码/标识符，称为 device model 或者叫 machine name，我们可以通过如下两种方法来获取 device model/machine name。
在这里插入图片描述

例如，去年发布的第一代 iPhone X 对应的 device mode 为 iPhone10,3 和 iPhone10,6，而今年最新发布 iPhone XS 对应 iPhone11,2，iPhone XS Max 对应 iPhone11,4 和 iPhone11,6，iPhone XR 对应 iPhone11,8，完整的 device mode 数据参考这里：

不过需要注意的是，上述两种获取 device model 的方法在模拟器中运行得到的值为 i386 或 x86_64，因此在模拟器中我们可以通过如下方式正确获取模拟器所对应的 device model：

// 获取模拟器所对应的 device model
NSString *model = NSProcessInfo.processInfo.environment[@"SIMULATOR_MODEL_IDENTIFIER"];

综上，我们可以通过判断 device model 是否为 “iPhone10,3” 和 “iPhone10,6” 或者以 “iPhone11,”（新设备）开头，来检测设备是否为 iPhone X，完整代码如下：
在这里插入图片描述

方式二：通过获取屏幕的宽高来判断

正如我们前面讲到，目前 iPhone X 设备的屏幕宽高对应的开发尺寸只有两种，分别为 375pt * 812pt 和 414pt * 896pt，因此我们可以根据屏幕的高度来判断设备是否为 iPhone X。但是此时需要考虑设备处于横屏或者竖屏的情况，这两种情况的宽高刚好是相反的（当然，如果你的 App 不用支持横屏的情况，就相对比较简单了）。

在 UIDevice 中提供了一个 orientation 属性用于获取设备的方向（横向、竖向、或者水平），一开始我们想着先通过这个属性判断设备处于横屏或者竖屏，然后分别取其对应的屏幕宽度（横屏下）或者高度（竖屏下）来判断，但是当这个属性的值为 FaceUp 或者 FaceDown（即设备放在水平面上），我们是无法知道此时设备是处于横屏还是竖屏的。

后面我们想了一个简便的方法，即获取屏幕的宽度和高度，取较大一方进行比较是等于 812.0 或 896.0，代码如下：
在这里插入图片描述

方式三：通过底部安全区域的高度来判断

在去年 iPhone X 发布后，为了适配顶部的浏览和底部的操作条，苹果在 iOS 11 上引入安全区域概念，建议开发者在安全区域内进行 UI 布局，因此我们可以获取屏幕 keyWindow 的 safeAreaInsets 值来判断设备是否 iPhone X。

iPhone X 在竖屏下，keyWindow 的 safeAreaInsets 值为：

{top: 44, left: 0, bottom: 34, right: 0}

而在横屏下，其值为：

{top: 0, left: 44, bottom: 21, right: 44}

因此，我们可以比较 safeAreaInsets 的 bottom 是否等于 34.0 或者 21.0 来判断设备是否为 iPhone X，因为其他设备对应的 bottom 横竖屏下都为 0，代码如下：
在这里插入图片描述

不过该方式有个不足是，必须在 AppDelegate 的 didFinishLaunchingWithOptions 回调中等 keyWindow 初始化之后才能正确判断。

方式四：通过是否支持 FaceID 判断

由于目前只有 iPhone X 设备支持 FaceID，因此我们也可以通过判断设备是否支持 FaceID 来判断，代码如下：
在这里插入图片描述

不足：如果用户禁用 canEvaluatePolicy:error: 方法的使用将无法正确判断，而且在也不适用于模拟器中的判断。

方式五：通过 UIStatusBar 的高度判断

在 iPhone X 之前，所有 iPhone 设备的 StatusBar（状态栏）高度都为 20pt，而 iPhone X 的为 44pt，因此我们可以通过获取状态栏的高度判断是否等于 44.0 来检测设备是否为 iPhone X，代码如下：
在这里插入图片描述

不足：该方法只适用于竖屏且显示状态栏的情况下才能正确检测，而在横屏模式下，或者 App 隐藏导航栏时，获取到的状态栏高度都为 0（statusBarFrame 的值为 CGRectZero），就无法判断了。

你是否有其他判断方式呢？欢迎补充~

结语

最后，绝大部分场景，我们需要检测设备是否为 iPhone X 是为了适配顶部的刘海区域和底部的操作条区域，但是这里我们更推荐通过 Auto Layout 结合 Safe Area 进行 UI 布局，以适应越来越复杂的屏幕状况。

原文链接

文中包含大量代码截图，如果你需要复制使用其中代码，请查阅这篇博文：

参考连接

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。

发布者：全栈程序员-用户IM，转载请注明出处：https://javaforall.cn/126147.html原文链接：https://javaforall.cn

【正版授权，激活自己账号】： Jetbrains全家桶Ide使用，1年售后保障，每天仅需1毛

【官方授权 正版激活】： 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

赞 (0)
全栈程序员-用户IM全栈程序员-用户IM
0 0


相关推荐

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号