如何在SwiftUI中获取实际的视图渲染大小和位置？

Question

问题是如何获取父视图中实际显示的渲染大小和位置？换句话说，如何在下面的SwiftUI代码中获取实际的Text("Foo")大小？

GeometryReader可用于通过size获取父提议的safeAreaInsets和安全区域插图，并且这些信息在GeometryProxy内部定义。您可以从下面的屏幕快照中看到，VStack的建议大小为300的宽度和300的高度，VStack的实际大小是未知的。

struct FooView: View {
    var body: some View {
        GeometryReader { geometryProxy in
            VStack {
                Text("\(geometryProxy.size.height), \(geometryProxy.size.width)")
                Text("Foo")
            }
            .background(Color.green)
        }
        .frame(width: 300, height: 300)
        .background(Color.blue)
    }
}

Answer 1

实际渲染大小

解决方法是通过带有嵌套.background的{​​{1}}修饰符获取实际渲染的大小。然后，可以将新几何代理中的尺寸信息存储在视图中定义的临时GeometryReader变量中。

@State

实际渲染位置

可以使用struct FooSizePreferenceKey: PreferenceKey { static let defaultValue = CGSize.zero static func reduce(value: inout CGSize, nextValue: () -> CGSize) { value = nextValue() } } struct FooView: View { @State private var fooSize: CGSize = .zero var body: some View { GeometryReader { geometryProxy in VStack { Text("\(self.fooSize.height), \(self.fooSize.width)") Text("Foo") .background( GeometryReader { fooProxy in Color .green .preference(key: FooSizePreferenceKey.self, value: fooProxy.size) .onPreferenceChange(FooSizePreferenceKey.self) { size in self.fooSize = size } } ) } } .frame(width: 300, height: 300) .background(Color.blue) } } 和Anchor计算视图的实际渲染位置。使用锚点和父级anchorPreference，我们可以轻松获取目标视图的位置geometryProxy信息。

.bound