苹果与2019年6月4日发布的全新UI框架旨在统一苹果各平台的UI(包括UIKit ,AppKit...),这是一些例子(包含部分来自官方的教程)。 在开始之前,你需要如下准备
工具 | 是否必须 |
---|---|
Xcode 11 beta | ✅ |
mac OS Mojave or Higher | ❎ |
(如果想要体验实时预览和完整的Xcode 11 功能,需要macOS 10.15 beta)
开始第一个demo 1.创建新的项目,并勾选使用SwiftUI
2.打开ContentView.swift
文件,文件内容如下
import SwiftUI
struct ContentView: View {
var body: some View {
Text("Hello SwiftUI")
}
}
#if DEBUG
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
#endif
如果使用的是macOS 10.15 beta 版本的系统则可以打开实时预览页面 (如果是macOS 10.14打开也只有源代码编辑界面) 修改UI只需要按住command点击对应了的UI控件(或代码)编辑即可如下图:(macos 10.14不会弹出此菜单),修改预览中路那个的属性会直接自动同步更新源代码,更改代码会更新预览视图
3.修改代码实现自定义视图(点击源码中Text跳转到定义,查看SwiftUI定义的所有控件代码约1W行 )示例代码
//
// ContentView.swift
// SwiftUI-example
import SwiftUI
struct ContentView: View {
var body: some View {
// 创建 文本(Label)
let aText = Text("Hello SwiftUI")
.color(.yellow)
.strikethrough()
.font(.system(size: 14.1))
// 创建 按钮(Button)
let aButton = Button(action: {
print(#function)
}) {
Text("Hello SwiftUI")
}
let aView = AnyView(aText)
// 创建图片
let anImage = Image("img")
.aspectRatio(contentMode: .fit)
// 布局各视图
return VStack {
anImage
aText
aButton
aView
}
}
}
#if DEBUG
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
#endif
更多官方示例源码:
如果你想了解更多关于SwiftUI的内容,你可以通过以下途径获取