Size Class：什么是 iOS 中的 Compact 和 Regular 尺寸类
Size Class — 是 iOS 中用于自适应布局的机制，它将所有设备按每个轴分为两个类别：Compact（窄/短）和 Regular（宽/长）。这些值的组合决定了界面在 iPhone、iPad、Mac Catalyst 和 CarPlay 上的显示方式。根据 Apple Human Interface Guidelines, 2024，Size Class 允许使用 Auto Layout 和 UITraitCollection 为所有设备构建一个 storyboard。该系统从 iOS 8 开始在所有 iOS 设备上运行。
要点
- Size Class — iOS 中的尺寸分类系统，每个轴有两个值：Compact（压缩）和 Regular（完整尺寸）。
- 水平 Size Class 在 iPhone 竖屏方向中 — Compact，在 iPad 中 — Regular。垂直方向 — 除 SE 外所有 iPhone 均为 Regular。
- UITraitCollection — 用于获取当前 Size Class 并在运行时响应 trait collection 变化的编程接口。
- Interface Builder 允许使用 Vary for Traits 工具为每个 Size Class 组合配置约束和元素的可见性。
- 基于 Size Class 的自适应布局 取代了 iPhone 和 iPad 的独立 storyboard — 一个文件适应所有设备。
什么是 Size Class？
Size Class — 是 iOS 中屏幕的抽象分类，由 Apple 在 iOS 8 中引入，用于统一自适应布局。Size Class 不检查设备的特定型号，而是确定两个特征：水平和垂直方向上的可用空间。每个特征取两个值之一 — Compact（有限空间）或 Regular（充足空间）。这些值的组合构成 trait collection，传递给所有界面元素。
历史和目的
在 Size Class 出现之前，开发人员为 iPhone 和 iPad 创建独立的 storyboard，或在代码中使用 UI_USER_INTERFACE_IDIOM() 检查。这导致了代码重复、storyboard 膨胀以及支持新屏幕尺寸的困难。Size Class 通过提供通用系统解决了问题：开发人员为 4 种 Compact/Regular 组合配置界面，iOS 自动选择合适的组合。随着 iPad 上 Split View 和不同 iPhone 尺寸的出现，该系统成为自适应布局不可或缺的一部分。
Size Class 如何工作
Size Class 由 iOS 根据当前屏幕的宽度和高度计算，同时考虑方向和 multitasking。这些值不与特定像素绑定 — 这是一个逻辑类别。例如，iPhone 16 Pro 在竖屏中具有水平 Compact 和垂直 Regular。同一部 iPhone 在横屏中 — 两个轴均为 Compact。iPad 在 Split View 中占用 1/3 屏幕的应用获得水平 Compact，而在全屏模式下则为 Regular。系统在方向或 Split View 更改时自动更新 Size Class。
有哪些尺寸类
Size Class 使用两个轴上两个值的四种组合。每种组合根据设备类型及其方向有不同的应用。理解这些组合是为 iOS 设计自适应界面的基础。该系统涵盖所有当前的 Apple 设备：iPhone、iPad、Mac Catalyst 和 CarPlay。Apple 建议从 wAny hAny 组合（基本布局）开始设计，并为特定组合进行细化。
四种 Size Class 组合
wCompact hRegular — 竖屏 iPhone（某些情况下 Plus/Max 除外）。wCompact hCompact — 横屏 iPhone SE/6/7/8。wRegular hRegular — 全屏 iPad 任意方向，iPhone Plus/Max 在横屏中。wRegular hCompact — 内容较窄的横屏 iPad。每种组合确定哪些约束和元素处于活动状态。开发人员可以在 Interface Builder 中为每种组合单独设置外观。
Mac Catalyst 的 Size Class
在 Mac Catalyst 上，Size Class 始终为 wRegular hRegular — 全尺寸界面。这意味着 iPad 应用的 Mac 版本获得最大空间。开发人员可以通过 UIScreen.traitCollection.userInterfaceIdiom 使用额外检查来区分 Mac 和 iPad。Size Class 在 Mac 上稳定运行，但 Catalyst 应用通常需要额外的鼠标和键盘适配，超出了 Size Class 的范围。
Size Class 如何影响自适应布局
Size Class 确定哪些 Auto Layout 约束处于活动状态、哪些界面元素可见以及 subview 如何排列。开发人员可以为不同的 Size Class 设置不同的约束，iOS 在 trait collection 更改时自动切换它们。例如，在 iPad（wRegular hRegular）上，带详细信息的表格在 Master-Detail 中显示，在 iPhone（wCompact hRegular）上 — 在 Navigation Stack 中。这是使用 Size Class 进行自适应布局的主要场景。
设置和删除约束
在 Interface Builder 中，开发人员通过 Vary for Traits 按钮选择 Size Class 组合，并添加仅针对此组合起作用的约束。为 wAny hAny 设置的约束始终有效。为特定组合设置的约束仅在 Size Class 匹配时激活。如果某个组合未设置特殊约束，则使用基本约束。当 Size Class 更改时，iOS 在约束集之间进行动画过渡。
隐藏和显示元素
Interface Builder 中的 Installed 标志 允许为特定 Size Class 隐藏元素。开发人员将元素标记为对所选的组合 Uninstalled。例如，Details 按钮仅在 iPad（wRegular hRegular）上可见，在 iPhone 上则隐藏。这比在代码中管理 isHidden 更简单。对于编程隐藏，使用覆盖 traitCollectionDidChange 或 willTransition 方法，在其中检查当前 Size Class。
在 Interface Builder 中使用 Size Class
Interface Builder 提供可视化工具 Vary for Traits 用于处理 Size Class。开发人员选择所需的组合（宽度和高度），Interface Builder 显示此组合的屏幕预览。在此模式下所做的所有约束、尺寸、字体和可见性更改仅应用于所选的 Size Class。退出模式确认设置。这种方法取代了为不同设备编写适配代码的需要。
在 Interface Builder 中逐步操作
要在 Interface Builder 中配置 Size Class，开发人员打开 storyboard，选择 view controller，然后按下底部面板中的 Vary for Traits 按钮。然后选择 Width（Compact、Regular 或 Any）和 Height（Compact、Regular 或 Any）。界面切换到所选组合的编辑模式。所有约束更改、添加或删除元素仅适用于此组合。配置完成后，开发人员退出模式 — 更改将保存到特定的 Size Class 组合。
最佳实践
Apple 建议从 wAny hAny（覆盖所有设备的基本组合）的基本布局开始。然后为有问题的组合细化布局：wCompact hRegular（竖屏 iPhone）和 wRegular hRegular（iPad）。不建议配置每个组合 — 只在布局出现问题时配置。过度配置会使维护复杂化。对于字体的精确调整，使用 Dynamic Type 代替 Size Class：字体自动适应屏幕尺寸。
代码中的 Size Class：UITraitCollection
UITraitCollection — 是一个 iOS 类，包含当前的 Size Class 和其他环境特征（force touch、display scale、user interface idiom）。每个 UIView 和 UIViewController 都有自己的 traitCollection，从父级继承。开发人员通过 traitCollection.horizontalSizeClass 和 traitCollection.verticalSizeClass 获取 Size Class，它们返回 UIUserInterfaceSizeClass（.compact、.regular 或 .unspecified）。Size Class 的更改通过覆盖 traitCollectionDidChange 来跟踪。
示例：在代码中切换布局
考虑一个示例：将 UICollectionView 布局适配到 Size Class。在 iPad（wRegular hRegular）上，我们使用两列 UICollectionViewCompositionalLayout，在 iPhone（wCompact hRegular）上 — 使用一列。代码检查水平 Size Class 并选择相应的布局。在旋转或转换到 Split View 时，iOS 调用 traitCollectionDidChange，控制器通过动画切换布局。
swift
override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
super.traitCollectionDidChange(previousTraitCollection)
if traitCollection.horizontalSizeClass == .Compact {
collectionView.collectionViewLayout = SingleColumnLayout()
} else {
collectionView.collectionViewLayout = DoubleColumnLayout()
}
}响应 trait collection 变化
traitCollectionDidChange 方法 在每次 Size Class 更改时调用：设备旋转、进入/退出 Split View、连接外部显示器。在此方法中，开发人员更新布局、重新加载集合、更新约束优先级或更改元素可见性。重要的是检查究竟是 Size Class 还是其他特征发生了变化：将 traitCollection.horizontalSizeClass 与 previousTraitCollection?.horizontalSizeClass 进行比较。优化可防止 force touch 或 display scale 更改时的多余重绘。
不同设备上的 Size Class 特性
不同的 Apple 设备 具有不同的 Size Class 组合，开发人员必须考虑这些特性。iPhone 在竖屏中 — wCompact hRegular，在横屏中 — 取决于型号：iPhone SE/6/7/8（wCompact hCompact），iPhone X 及更新型号（wCompact hCompact 或 wCompact hRegular 取决于内容）。iPad 在全屏模式下 — wRegular hRegular，在 Split View 中 — 可以是 wCompact hRegular（1/3 屏幕）或 wRegular hRegular（2/3 屏幕）。Mac Catalyst — 始终为 wRegular hRegular。
iPhone：所有尺寸
在 iPhone 上，Size Class 对大多数型号稳定，但存在细微差别。iPhone Plus（6+、7+、8+）和 Max（X、XS、11 Pro、13–16 Pro Max）在横屏中具有 wRegular hCompact — 类似于 iPad mini。这允许在大型 iPhone 横屏中将内容排列为两列。iPhone SE（1–3 代）在横屏中 — wCompact hCompact。所有 iPhone 在竖屏中的垂直 Size Class — Regular，但 iPhone SE 在横屏中为 Compact。水平方向 — 竖屏和横屏始终为 Compact（横屏中的 Plus/Max 除外）。
iPad 和 Split View
iPad 在全屏模式下 — wRegular hRegular，提供最大的布局灵活性。在 Split View 中行为会改变：如果应用占据 1/3 屏幕（Slide Over 或 1/3 Split），水平 Size Class 变为 Compact，尽管垂直方向保持 Regular。在 2/3 屏幕 — wRegular hRegular。开发人员应在所有 Split View 模式下测试界面，因为 Size Class 会动态变化。Apple 建议将 Size Class 与 UISplitViewController 一起使用，以在 iPad 上获得一致的行为。
常见问题
Size Class 与 CSS 中的断点有何不同？
Size Class — 是一个具有 4 种组合的离散系统，而 CSS 断点是连续的，具有任意数量的点。Size Class 从具体的屏幕尺寸中抽象出来，根据行为对设备进行分组。CSS 断点与像素绑定，Size Class — 与 Compact/Regular 逻辑类别绑定。
为什么 iPhone Plus 在横屏中 Size Class 水平为 Regular？
iPhone Plus/Max 在横屏中具有足够的屏幕宽度来显示两列内容（如 iPad mini）。Apple 分配水平 Regular 以便开发人员无需额外检查即可使用多列布局。这是 iPhone Compact 规则的一个例外。
可以以编程方式更改 Size Class 吗？
Size Class 由 iOS 根据设备的实际特征确定，无法从应用代码更改。开发人员只能对当前值做出反应。System UI 可以为系统元素覆盖 Size Class，但在应用中这是不可能的。
Size Class 如何与 SwiftUI 配合使用？
SwiftUI 不直接使用 Size Class — 相反，开发人员应用 @Environment(\.horizontalSizeClass) 修饰符来读取当前值。SwiftUI 提供更高级别的工具：Size Classes 和带 Layout 协议的 AnyLayout 用于自适应布局。
连接外部显示器时 Size Class 会更新吗？
是的，通过 Stage Manager 或 Sidecar 连接外部显示器时，iOS 会更新 Size Class。外部显示器通常获得 wRegular hRegular，而主屏幕保留其 Size Class。traitCollectionDidChange 为每个屏幕上的窗口独立调用。
总结
- Size Class — iOS 屏幕分类系统，每个轴有 Compact/Regular 两个值，共 4 种组合。
- iPhone 在竖屏中 — wCompact hRegular。iPad 在全屏模式下 — wRegular hRegular。iPhone Plus/Max 在横屏中 — wRegular hCompact。
- Interface Builder 提供 Vary for Traits 用于每个 Size Class 的约束和可见性的可视化配置。
- UITraitCollection — 通过 horizontalSizeClass 和 verticalSizeClass 读取 Size Class 的编程 API。更改在 traitCollectionDidChange 中跟踪。
- iPad 上的 Split View 动态更改 Size Class：在 1/3 屏幕时，水平方向变为 Compact，需要布局适配。
- SwiftUI 提供 @Environment(\.horizontalSizeClass) 用于读取 Size Class 和 AnyLayout 用于在运行时切换布局。
- 建议 从 wAny hAny 布局开始，然后适配 wCompact hRegular（iPhone）和 wRegular hRegular（iPad），而不使其他组合过载。
我们将开发一款交钥匙移动应用程序
IT Sectr自2017年以来为初创企业和企业打造iOS和Android应用程序。我们将为您提供咨询并提出最佳解决方案。
另请阅读