文章

SwiftUI 预览视图

发表于
作者 Guanghui Liang
1 分钟阅读

SwiftUI 一个很强的特性就是可以实时预览页面，边写代码边看代码的实现效果

同时预览多个机型

如果想在 SwiftUI 项目中预览多个机型的话，可以把 Preview 的代码改成如下形式：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        Group {
            ContentView()
                .previewInterfaceOrientation(.portrait)		// 这里修改设备屏幕方向
            ContentView()
                .previewInterfaceOrientation(.landscapeLeft)
            ContentView()
                .previewDevice(PreviewDevice(rawValue: "iPhone 12 Pro"))	// 这里修改设备型号，设备型号一定要写对
                .previewDisplayName("iPhone 12 Pro")	// 这里修改设备展示名字
            ContentView()
                .previewDevice(PreviewDevice(rawValue: "iPad Air (4th generation)"))
                .previewDisplayName("iPad Air (4th generation)")
        }
    }
}

注意： Group {} 是必需的，否则会导致各机型中的视图属性不同步，从而导致预览失败

iOS, SwiftUI
ios swiftui
本文由作者按照 CC BY-NC-SA 4.0 进行授权