为什么 `GeometryReader` 在窗口调整大小期间返回较小的尺寸，而视图在视觉上保持其尺寸？

Question

我在 SwiftUI 中使用

GeometryReader

来跟踪

Color.black

背景的框架。但是，当我调整窗口大小时，从

GeometryReader

（通过

geo.frame(in: .local)

）检索的大小会意外缩小，即使

Color.black

背景在视觉上仍然保持正确的大小。

这是我正在使用的代码：

struct ContentView: View {
  @State private var rect: CGRect = CGRect()

  var body: some View {
    GeometryReader { geo in
      ZStack {
        Color.black
          .onAppear {
            rect = geo.frame(in: .local)
          }
          .onChange(of: geo.frame(in: .local)) { oldValue, newValue in
            rect = newValue
          }

        Color.red.frame(width: rect.width, height: 2.0)
        Color.blue.frame(width: 2.0, height: rect.height)
        Color.green
          .frame(width: 300.0, height: 50.0)
          .offset(y: -100.0)
      }
    }
    .padding(300.0)
  }
}

Why is the size value from the GeometryReader shrinking during a window resize, and how can I ensure it always matches the size of the Color.black background?

Answer 1

出现此问题的原因是

GeometryReader

应用于整个

ZStack

，导致它测量整个布局的大小，包括填充和其他元素。这会导致窗口大小调整期间尺寸值意外缩小。

要解决此问题，请仅用

Color.black

包裹

GeometryReader

背景。通过这种方式，它可以仅测量背景的大小，确保数值准确且一致。以下是更新代码的方法：

struct ContentView: View {
  @State private var rect: CGRect = CGRect()

  var body: some View {
    ZStack {
      GeometryReader { geo in
        Color.black
          .onAppear {
            rect = geo.frame(in: .local)
          }
          .onChange(of: geo.frame(in: .local)) { _, newValue in
            rect = newValue
          }
      }

      Color.red.frame(width: rect.width, height: 2.0)
      Color.blue.frame(width: 2.0, height: rect.height)
      Color.green
        .frame(width: 300.0, height: 50.0)
        .offset(y: -100.0)
    }
    .padding(300.0)
  }
}