本篇文章讨论的内容主要是View的刷新问题,当view需要刷新时,就会去计算body,那么,在某些特定场景下,view的状态并没有改变,如果每次都计算body,肯定会造成性能的浪费。接下来,我们就探讨一下,如何让view实现Equatable协议。
为了演示这个过程,我们写一个小的demo,每次点击按钮,随机生成一个整数,我们自定义一个view,显示该数字是奇数还是偶数。
代码如下:
struct ContentView: View { @State private var n: Int = 0 var body: some View { VStack { Spacer() OddOrEvenView(number: n) Text("\(n)") .foregroundColor(.primary) .padding(.vertical, 20) Button("随机生成整数") { self.n = Int.random(in: 10...1000) } .padding(.vertical, 20) Spacer() } } } extension Int { var isOdd: Bool { self % 2 != 0 } var isEven: Bool { self % 2 == 0 } } struct OddOrEvenView: View { let number: Int @State private var show = false var body: some View { print("OddOrEvenView刷新了, -- \(self.number)") return VStack { Text("\(number.isOdd ? "奇数" : "偶数")") .font(.largeTitle) .padding(20) .foregroundColor(.white) .background(RoundedRectangle(cornerRadius: 5).fill(number.isOdd ? Color.green : Color.blue)) } } }
上边的代码很简单,运行后,效果如下图:
打印如下:
从上边的例子中,我们总结出:
- 当我们修改了
n
后,OddOrEvenView都会计算body - 其实OddOrEvenView没必要每次都计算body,只有当奇偶切换的时候,才有必要重新计算body
我们让OddOrEvenView实现Equatable协议:
struct OddOrEvenView: View, Equatable { ... static func ==(lhs: OddOrEvenView, rhs: OddOrEvenView) -> Bool { return lhs.number.isOdd == rhs.number.isOdd } }
在看看打印结果:
结合上边的动图和打印结果,我们可以发现,实现了Equatable后,果然只有切换奇偶才会重新计算body。
我在上边的代码中埋了一个伏笔,大家留意这行代码了没?
@State private var show = false
在OddOrEvenView中,这行代码没什么卵用,那我为什么还要写它呢? 为了说明这里边的区别,咱们先去掉这行代码,然后运行:
结合动图和打印结果,我们发现,在每次修改n
后,OddOrEvenView每次都计算body了。为什么并没有用到的代码@State private var show = false
就能让Equatable生效呢?
在当前版本中的SwiftUI中,如果某个View实现了Equatable协议,只有当其内部存在复杂属性的情况下,系统才会调用Equatable协议中的函数。
那么什么是复杂属性呢? 类似于用@State
, ObservedObject
或者environmentObject
等等,与之相对应的是POD(plain data), 也就是基本数据类型。
那么有没有一种方法,让我们不用关心View中是否有复杂属性,也能调用Equatable协议中的方法呢?答案就是EquatableView
或.equatable()
,他们是等效的。
struct ContentView: View { @State private var n: Int = 0 var body: some View { VStack { Spacer() EquatableView(content: OddOrEvenView(number: n)) Text("\(n)") .foregroundColor(.primary) .padding(.vertical, 20) Button("随机生成整数") { self.n = Int.random(in: 10...1000) } .padding(.vertical, 20) Spacer() } } }
只需要修改一点点代码就可以了,我就不把打印结果弄上来了,大家有兴趣的可以自己运行并查看效果。
EquatableView(content: OddOrEvenView(number: n)) OddOrEvenView(number: n).equatable()
值得注意的是,上边两种写法是等效的。但是,经过我的验证, 只有View中有复杂属性的时候才会调用Equatable协议中的函数。
这也算符合逻辑,我做一个简单的总结:
- 当view中包含复杂属性的时候,如果view实现了Equatable协议,则调用我们写的协议函数
- 当view中不包含复杂属性的时候,如果实现了Equatable协议,则系统会自动根据view值的变化进行刷新,如果没有实现Equatable协议,则每次都需要计算body