前言
在学习了SwiftUI中的基本的视图和属性样式以及界面布局的一下知识点后，我们就可以玩玩一些小项目了，来看看数据在SwiftUI中是怎样传输或者使用的。
1、State
前面的很多例子中我们已经使用过@State，类似于之前使用的成员属性一样，不同的是@State修饰的变量不用手动调用界面刷新，只要变量改变就会自动刷新UI。
@State官方建议使用private，即在当前界面使用的变量，不可以在对象间使用。
2、Binding
@Binding 可以在不同的对象间传值。它所修饰的变量不是变量本身改变，而是变量的引用改变。
结合$xxx（投影属性）使用在代码中。
3、AppStorage
AppStorage类似之前用的NSUserDefault，用于存储一些轻量级的数据。是一个属性包装器。所存储的数据是全局的。
//messageKey 相当于key 寻找value时候用
//message 当前变量 装载数据
@AppStorage("messageKey") var message: String = ""
VStack{
Text("已经存储数据：\n\(message)")
TextField("输入保存的数据",text: $message)
.padding(10).border(.orange, width: 2)
Button("按钮保存"){
message = "按钮保存的数据"
}.font(.title)
}.padding()
输入框输入时，数据改变时，本地存储实时改变所存储数据，推出App，重新打开数据展示为上一次输入数据。
当点击按钮保存数据时，再次进来就展示“按钮保存的数据”。
相对于NSUserDefault，AppStorage使用上方便快捷，不用去setValue以及getValue操作。
另外还有一个SceneStorage，也是数据持久化方式，是SwiftUI接管的，但只能用在View上。
4、ObservableObject
所有遵循ObservableObject协议的class，就可以直接使用@Pulished 来修饰属性，这个属性改变后，所有使用到这个属性的地方会自动刷新UI。用法上类似于前文的@State。
//放在 ContentView 范围内外都可以 最好方外面
class DelayUpdater: ObservableObject {
@Published var value = 0
init() {
for i in 1...10 {
DispatchQueue.main.asyncAfter(deadline: .now() + Double(i)) {
self.value += 1
}
}
}
}
@ObservedObject var updater = DelayUpdater()
var body: some View {
Text("\(updater.value)").padding()
}
如果我们在数值改变前还想多做一些操作，我们可以使用willSet 及 objectWillChange来实现。
var value = 0 {
willSet {
//此处做另外的一些操作
//前导的判断
//动画
//调用其他方法
objectWillChange.send()
}
}
这种方式可创造性大一点，便于实现多种功能。
5、EnvironmentObject
顾名思义，就是将数据放到环境中去，这样可以全局地从环境中获取想要的数据。
在上面例子中新增两个View:
struct ShowValueView: View {
@EnvironmentObject var updater: DelayUpdater
var body: some View {
Text("\(updater.value)")
}
}
struct BtnView: View {
@EnvironmentObject var updater: DelayUpdater
var body: some View {
Text("\(updater.value)")
}
}
然后在body中展示上面两个View:
//直接可以使用let
let updater = DelayUpdater()
var body: some View {
VStack{
ShowValueView().environmentObject(updater)
BtnView().environmentObject(updater)
}
}
所以这两个View通过去环境中拿数据展示，此处还可以将.environmentObject(updater)放到VStack后，效果一样的，子视图都需要updater。
完整代码：
class DelayUpdater: ObservableObject {
//@Published
var value = 0 {
willSet {
//此处做另外的一些操作
//前导的判断
//动画
//调用其他方法
objectWillChange.send()
}
}
init() {
for i in 1...10 {
DispatchQueue.main.asyncAfter(deadline: .now() + Double(i)) {
self.value += 1
}
}
}
}
struct ShowValueView: View {
@EnvironmentObject var updater: DelayUpdater
var body: some View {
Text("\(updater.value)")
}
}
struct BtnView: View {
@EnvironmentObject var updater: DelayUpdater
var body: some View {
Text("\(updater.value)")
}
}
struct ContentView: View {
let updater = DelayUpdater()
var body: some View {
VStack{
ShowValueView().environmentObject(updater)
BtnView().environmentObject(updater)
}
}
}
6、UIKit与SwiftUI交互
例如想在SwiftUI中使用UIKit中的一个视图控制器，那么需要满足怎样的条件呢？
例如在一个SwiftUI项目中新建了一个Swift文件，新建一个UIViewController的子类，首先创建一个结构体，让此结构体遵循UIViewControllerRepresentable协议：
class SubViewController : UIViewController { }
struct SubVC : UIViewControllerRepresentable {
func makeUIViewController (context: Context) -> SubViewController{
return SubViewController()
}
func uodateUIViewController (_ uiviewController: SubViewController , context: Context) {}
}
如上SubViewController就可以在SwiftUI中正常使用了。
拓展：普通.swift类型文件没有预览功能，而SwiftUI文件默认自带预览功能。如果.swift类型需要有预览功能的话，可以模仿ContentView中的方法：
struct SubViewController_Previews: PreviewProvider {
static var previews: some View {
SubVC()
}
}
7、ViewModifier
类似于前端CSS视图样式，可以将控件的属性包装起来，定义一次，全局不同子控件都能使用。
struct myModifier: ViewModifier {
func body(content: Self.Content) -> some View {
content.foregroundColor(.red).font(Font.system(size: 20, weight: .bold)).border(.green,width: 2)
}
}
struct ContentView: View {
let updater = DelayUpdater()
var body: some View {
VStack{
Text("Hello Lcr").modifier(myModifier())
Text("Hello Zf").modifier(myModifier())
}
}
}
这样就可自定义多地方使用的ViewModifier，相同样式的View就可以使用。
8、redacted
利用redacted可以给View添加一个类似马赛克的效果。默认效果为.placeholder。
public enum RedactionReason {
case placeh
case black
case blur
}
struct Placeholder: ViewModifier {
func body(content: Content) -> some View {
content.opacity(0)
.overlay {
RoundedRectangle(cornerRadius: 2)
.fill(.black.opacity(0.16))
}
}
}
struct BlackV: ViewModifier {
func body(content: Content) -> some View {
content.overlay(Color.black)
}
}
struct Blurred: ViewModifier {
func body(content: Content) -> some View {
content.blur(radius: 4)
}
}
struct Redactable: ViewModifier {
let reason: RedactionReason?
@ViewBuilder
func body(content: Content) -> some View {
switch reason {
case .placeh:
content.modifier(Placeholder())
case .black:
content.modifier(BlackV())
case .blur:
content.modifier(Blurred())
case nil:
content
}
}
}
extension View{
func redacted(reason:RedactionReason?) -> some View{
self.modifier(Redactable(reason: reason))
}
}
struct ContentView: View {
let updater = DelayUpdater()
var body: some View {
VStack{
Text("Hello Lcr").padding()
.redacted(reason: .blur)
Text("Hello Zf")
}
}
}
利用.redacted(reason: .blur)就可切换不一样的样式。
