iOS 16.1模拟器中GeometryReader帧变化时onPreferenceChange未触发

问题场景 #

在SwiftUI开发中，使用GeometryReader监听ScrollView坐标空间内的frame变化时，onPreferenceChange始终不触发，但GeometryReader内部的Text能正常显示数值变化。相关代码及现象如下：

PreferenceKey 定义 #

struct ScrollPrefKey: PreferenceKey {
  static var defaultValue: CGFloat = 0

  static func reduce(value: inout CGFloat, nextValue: () -> CGFloat) {
    value = nextValue()
  }
}

主代码 #

ScrollView {
     GeometryReader { proxy in
         Text("\(proxy.frame(in: .named("scroll")).minY)") // 数值能正常变化
         Color.clear.preference(key: ScrollPrefKey.self, value: proxy.frame(in: .named("scroll")).minY)
     }

     VStack {
       Button(action: {}, label: {Text("myButton")})
       // 主内容
     }

 }
 .coordinateSpace(name: "scroll")
 .onPreferenceChange(ScrollPrefKey.self, perform: { value in
    print(value)
    // 这里从未执行
 })

异常现象 #

• 预览中功能正常，但iOS 16.1模拟器里完全失效；
• 把VStack换成固定高度的Color组件后，onPreferenceChange能正常触发；
• 嵌套ScrollView内所有内容后问题依旧。

问题原因 #

1. ScrollView内容未超出可视范围：当ScrollView内的总内容高度不超过屏幕高度时，滚动视图不会触发滚动相关的布局更新逻辑，导致GeometryReader的preference值变化无法被父视图捕获。换成固定高度Color后内容足够长，滚动逻辑激活，所以能正常工作。
2. GeometryReader的布局绑定问题：直接将GeometryReader作为ScrollView的子视图，其布局没有完全绑定到滚动视图的滚动状态，preference的更新信号无法正确传递。

解决方法 #

方法1：让ScrollView内容足够长 #

给VStack设置最小高度，强制内容超出屏幕范围，激活滚动逻辑：

VStack {
  Button(action: {}, label: {Text("myButton")})
  // 主内容
}
.frame(minHeight: UIScreen.main.bounds.height + 100) // 确保内容超出屏幕高度

方法2：将GeometryReader作为内容背景 #

把GeometryReader放到ScrollView内容的背景中，这样它会完全跟随滚动状态更新：

ScrollView {
  VStack {
    Button(action: {}, label: {Text("myButton")})
    // 主内容
  }
  .background(
    GeometryReader { proxy in
      Color.clear.preference(key: ScrollPrefKey.self, value: proxy.frame(in: .named("scroll")).minY)
    }
  )
}
.coordinateSpace(name: "scroll")
.onPreferenceChange(ScrollPrefKey.self, perform: { value in
  print(value)
})

方法3：给GeometryReader设置全屏frame #

确保GeometryReader占据ScrollView的全部空间，让布局更新被正确检测：

ScrollView {
  GeometryReader { proxy in
    Color.clear
      .preference(key: ScrollPrefKey.self, value: proxy.frame(in: .named("scroll")).minY)
  }
  .frame(maxWidth: .infinity, maxHeight: .infinity) // 占满ScrollView空间

  VStack {
    Button(action: {}, label: {Text("myButton")})
    // 主内容
  }
}
.coordinateSpace(name: "scroll")
.onPreferenceChange(ScrollPrefKey.self, perform: { value in
  print(value)
})

内容的提问来源于stack exchange，提问作者royB