SwiftUI 自适应布局

SwiftUI Adaptive Layout

使用 UIKit 写一套能够根据屏幕尺寸和方向自动更换布局的代码是比较麻烦的（至少从我目前的经验来看～），但是用 SwiftUI 来实现就会轻松一点。

在 SwiftUI 中，Apple 引入了一个概念 Size Classes (尺寸类型)，且在横向和竖向两个维度上分别有 Horizontal Size Class 和 Vertical Size Class. Size Classes 可进一步分为两种：regular (标准) 和 compact (紧凑). 而设备的 Size Classes 由它的屏幕尺寸和屏幕方向决定，目前常见的设备 Size Classes 如下表所示，

可以看到所有的 iPhone 在竖屏的时候都是 compact 紧凑型，而所有的 ipad 不管是横屏还是竖屏都是 regular 标注型

Usage

利用 SwiftUI 关键词 @Environment 可以监听横屏或者竖屏时的尺寸类型的变化，再根据这个变化来确定布局

@Environment(\.verticalSizeClass) var verticalSizeClass

...

if verticalSizeClass == .compact {
    HSignButtonExtractedView()
} else {
    VSignButtonExtractedView()
}

...