我有一个带有 HStack 视图的 ScrollView,这些视图会根据它们自己的位置进行动画处理。为此,我使用了一个 GeometryReader,它将读取每个视图的当前全局位置,当到达某个位置时,视图将从失焦状态切换到聚焦状态,并进行一些转换并将 @State 变量更改为指示视图处于焦点位置,以便视图的其他部分可以对其进行操作。
相当简单,对吧?不幸的是,当我从 GeometryReader 中更改 @State 时,状态更改不会发生。因此,我构建了一个简化版本来演示该问题。
这是代码:
import SwiftUI
struct GeometryReaderTest: View {
var body: some View {
ScrollView(.horizontal, showsIndicators: false) {
//
HStack(spacing: 40){
ForEach(0..<10) { _ in
SlideView()
}
}
}
}
}
struct SlideView : View {
//
@State var isInFocus : Bool = false
var body: some View {
ZStack {
Rectangle().fill( isInFocus ? Color.green : Color.orange).frame(width: UIScreen.main.bounds.width - 60, height: 120, alignment: .center)
MyContent(isInFocus: self.$isInFocus)
}
}
}
struct MyContent : View {
@Binding var isInFocus : Bool
var body: some View {
GeometryReader { geo in
self.toggleFocusState(geometry: geo)
}
}
func toggleFocusState(geometry : GeometryProxy)-> some View{
let distance = geometry.frame(in: .global).origin.x.magnitude
self.isInFocus = distance < 120
return VStack {
Text("Focused: \(self.isInFocus ? "Yes" : "Nope" )")
Text("Distance: \(distance)")
Button(action: {
//
self.isInFocus.toggle()
}) {
Text("Toggle")
}
}
}
}
struct GeometryReaderTest_Previews: PreviewProvider {
static var previews: some View {
GeometryReaderTest()
}
}
当您点击同样在 GeometryReader 中运行的“切换”按钮时,@State 变量将成功更改并反映更改。
当您实际滚动 ScrollView 并让它自然滚动时,什么都不会发生。即使停止后也不会更新。
见这里:https ://streamable.com/d3op74
当您在 ScrollView 中缓慢滚动而不抬起手指时,@State 变量会发生变化。
在这里:https ://streamable.com/7m15t9
如果您像这样使用 DispatchQueue.main.asyncAfter() 引入延迟:
DispatchQueue.main.asyncAfter(deadline: .now() + 0.0) {
self.isInFocus = distance < 120
}
即使延迟为 0,@State 更改也会在您滚动时起作用,无论多快,但是这次切换按钮不起作用(这是有道理的,因为 GeometryReader 会重新计算并推翻由按钮)。
在这里:https ://streamable.com/q3ylu1
有人可以解释一下这里发生了什么吗?这是预期的行为还是错误?