如何在 SwiftUI 中创建一个获取 View 并返回自定义结果的函数？

Question

我想建立一个独立于 ContentView 的函数，我可以使用这个函数来初始化一些值，例如在这个向下的代码中，我想用函数获取 View 的大小，但是由于我未知的原因它返回零，我认为背景修改在此版本中无法正常工作。有什么帮助吗？

  func viewSizeReaderFunction<Content: View>(content: Content) -> CGSize {
    
    var sizeOfView: CGSize = CGSize()
    
    content
        .background(
            GeometryReader { geometry in
                Color
                    .clear
                    .onAppear() { sizeOfView =  geometry.size }
                
            })

    return sizeOfView

 }

---

let sizeOfText: CGSize = viewSizeReaderFunction(content: Text("Hello, world!"))

---

struct ContentView: View {

    var body: some View {

        Color.red
            .onAppear() {
                print(sizeOfText)
            }

    }
  
}

Answer 1

一般的想法是让视图使用preference 报告其大小，并创建一个视图修饰符来捕获它。但是，就像@RobNapier 所说，结构必须在视图层次结构中，因此在渲染上下文中，才能谈论大小。

struct SizeReporter: ViewModifier {
   @Binding var size: CGSize
   func body(content: Content) -> some View {
      content
         .background(GeometryReader { geo in
             Color.clear
                  .preference(key: SizePreferenceKey.self, value: geo.size)
         })
         .onPreferenceChange(SizePreferenceKey.self, perform: { value in
             size = value
         })
   }
}

我们需要定义SizePreferenceKey：

extension SizeReporter {
   private struct SizePreferenceKey: PreferenceKey {
      static let defaultValue: CGSize = .zero
      static func reduce(value: inout CGSize, nextValue: () -> CGSize) {
         value = nextValue()
      }
   }
}

你可以在View上创建一个方便的方法：

extension View {
   func getSize(_ size: Binding<CGSize>) -> some View {
      self.modifier(SizeReporter(size: size))
   }
}

并像这样使用它：

@State var size: CGSize = .zero

var body: some View {
   Text("hello").getSize($size)
}

Answer 2

视图只是描述视图布局的数据。它们不是像 UIView 那样代表实际“视图”的对象。它们没有自己的逻辑或状态（这就是为什么它们需要@State 变量而不仅仅是var）。

您编写的代码将零大小分配给sizeOfView，然后创建一个立即丢弃的视图结构，然后返回sizeOfView。没有任何东西可以评估 View 结构。我希望编译器会就此向您发出警告，例如“未使用后台调用结果”。

您所描述的方式是使用首选项，.onPreferenceChange，通常是@State。围绕 Stack Overflow 有很多答案。

https://stackoverflow.com/search?q=%5Bswiftui%5D+size+of+view

这是一个例子，特别注意.hidden()的使用：

extension View {
    func saveSize(handler: @escaping (CGSize) -> Void) -> some View {
        return self
            .background(
                GeometryReader { geometry in
                    Color.clear
                        .onAppear {
                            handler(geometry.size)
                        }
                })
    }
}

struct ContentView: View {
    @State var sizeOfText: CGSize = .zero

    var body: some View {
        ZStack {
        Color.red
            .onAppear() {
                print(sizeOfText)
            }
            Text("Hello, world!")
                .hidden()
                .saveSize { sizeOfText = $0 }
        }
    }
}

请注意，这段代码有点危险，因为它依赖于调用onAppear 的顺序，而这并不是承诺的。在实践中，您通常需要处理尚未设置大小的情况。这可以通过 Preferences 变得更加健壮，但这往往很麻烦。