一 @State
加了@State注解的变量，视图通过监视和读取该变量来重新渲染UI。
struct NextPageView: View {
// State针对具体View的内部变量进行管理，不应该从外部被允许访问，所以应该标记为private
@State private var count:Int = 0;
@State private var name:String = "";
var body: some View {
VStack{
Text("数量 = \(count)")
Button("数量+1"){
count = count+1
}
// 只读直接使用变量名即可
Text("你的名字 = \(name)")
// 如果是读写都有，引用属性需要$开头
TextField("请输入你的名字", text: $name)
}
}
}
二 @Published
@Published是SwiftUI最有用的包装之一，允许我们创建出能够被自动观察的对象属性，SwiftUI会自动监视这个属性，一旦发生了改变，会自动修改与该属性绑定的界面。
三 @ObservedObject
@ObservedObject告诉SwiftUI，这个对象是可以被观察的，里面含有被@Published包装了的属性。
@ObservedObject包装的对象，必须遵循ObservableObject协议。也就是说必须是class对象，不能是struct。
@ObservedObject允许外部进行访问和修改。
class DataViewModel: ObservableObject {
@Published var value: Int = 0
init() {
for i in 1...10 {
DispatchQueue.main.asyncAfter(deadline: .now() + Double(i)) {
self.value += 1
}
}
}
}
struct NextPageView: View {
@ObservedObject var viewModel = DataViewModel()
var param:String
var body: some View {
VStack{
// viewModel的数据变化将自动更新view
Text("数量 = \(viewModel.value)")
Spacer()
}
}
}
四 @EnvironmentObject
@State处理单个视图的局部状态，以及@ObservedObject如何使我们在视图之间传递一个对象，以便我们可以共享它，@ EnvironmentObject更进一步：我们可以将对象放置到环境中，以便任何子视图都可以自动访问它。
@EnvironmentObject包装的属性是全局的，整个app都可以访问
class User: ObservableObject {
@Published var name = "Sunny"
}
struct EnvironmentObjectView: View {
let user = User()
var body: some View {
VStack {
EditView().environmentObject(user)
DisplayView().environmentObject(user)
}
}
}
struct EditView: View {
@EnvironmentObject var user: User
var body: some View {
TextField("Name", text: $user.name)
}
}
struct DisplayView: View {
@EnvironmentObject var user: User
var body: some View {
Text(user.name)
}
}
五 @Environment
@Environment与@EnvironmentObject作用是不同的，@Environment是从环境中取出预定义的值，比如获得当前是暗黑模式还是正常模式，屏幕的大小等等。
@Environment(\.horizontalSizeClass) var horizontalSizeClass
@Environment(\.managedObjectContext) var managedObjectContext
根据 Light 和 Dark 两种系统颜色模式来调整 app 界面的配色是很常见的需求。方法很简单，通过 Environment.colorScheme 获取当前系统环境的颜色方案就行了：
struct ContentView: View {
// colorScheme values: .light, .dark
@Enviroment(\.colorScheme) var colorScheme
var body: some View {
Text("Hello, World")
.foregroundColor(colorScheme = .light ? .yellow : .blue)
}
}
六 @Binding
把一个视图的属性传至子节点中，但是又不能直接的传递给子节点，因为在 Swift 中值的传递形式是值类型传递方式，也就是传递给子节点的是一个拷贝过的值。但是通过 @Binding 修饰器修饰后，属性变成了一个引用类型，传递变成了引用传递，这样父子视图的状态就能关联起来了.
struct NextPageView: View {
// State针对具体View的内部变量进行管理，不应该从外部被允许访问，所以应该标记为private
@State private var count:Int = 0;
@State private var name:String = "";
var param:String
var body: some View {
VStack{
Text("数量 = \(count)")
Button("数量+1"){
count = count+1
}
// 只读直接使用变量名即可
Text("你的名字 = \(name)")
// 如果是读写都有，引用属性需要$开头
TextField("请输入你的名字", text: $name)
// 子节点传递
ChildView(name: $name)
Spacer()
}
}
}
struct ChildView: View {
// 通过@Binding子节点的修改,会变更到父节点上
@Binding var name: String
// @State var name: String
var body: some View {
VStack{
Text("子节点获取名字 : \(name)")
TextField("子节点请输入你的名字", text: $name)
}
}
}
七 @GestureState
@GestureState能够让我们传递手势的状态，虽然使用@State也能实现，但@GestureState能让手势结束后我们回到最初的状态。
struct GesturesUIView: View {
@GestureState var isLongPressed = false
var body: some View {
let longPress = LongPressGesture()
.updating($isLongPressed) { value,state,transcation in
print(value)
state = value
}
return Rectangle()
.fill(isLongPressed ? Color.red: Color.green)
.frame(width: 300, height: 300)
.cornerRadius(8)
.padding()
.scaleEffect(isLongPressed ? 1.2 : 1)
.gesture(longPress)
.animation(.interactiveSpring())
}
}
参考:
