SWIFTUI 如何使用几何图形捕获 VStack 高度（在显示 VStack 之后）？

Question

我想请你帮忙。我正在尝试使用 geometry 捕获 VStack 高度，然后根据该 VStack 高度 值，计算其子元素的高度（在 VStack 内）。

Image of my current view of VStack

我在 VStack 之外使用 .frame 来填充整个屏幕。然后我用 .border 目视检查它是否真的填满了屏幕（它工作正常）

.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: Alignment.topLeading)

问题可以在 VStack 内部看到，高度显示为 GCFloat 734。尽管边框尺寸要大很多。

struct BodyView: View {
    @State var stackHeight : CGFloat = 0

    var body: some View {
        GeometryReader { geometry in
            VStack {
                Text("VStack size: \(self.stackHeight)")
                    .bold()
                    .frame(maxWidth: .infinity, alignment: .leading)
                    .padding(.horizontal)
                    .background(Color.green)

            }
            .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: Alignment.topLeading)
            .onAppear{
                self.stackHeight = geometry.size.height
            }
            .border(Color.purple, width: 5)
        }
    }
}

struct BodyView_Previews: PreviewProvider {
    static var previews: some View {
        BodyView()
    }
}

如何在 VStack 完成加载后捕获它的实际大小？
当我触发（onAppear）时，VStack 高度显示正确，但是我需要立即捕获它。

Answer 1

如果我理解你的问题，你就很接近了——你只需要使用GeometryProxy 输入：

import SwiftUI

struct BodyView: View {

    var body: some View {
        GeometryReader { geometry in
            VStack {
                Text("VStack size: \(geometry.size.height)") // no need for state var anymore
                    .bold()
                    .frame(maxWidth: .infinity, alignment: .leading)
                    .padding(.horizontal)
                    .background(Color.green)
            }
            .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: Alignment.topLeading)
            .border(Color.purple, width: 5)
        }
    }
}

struct BodyView_Previews: PreviewProvider {
    static var previews: some View {
        BodyView()
    }
}

如果大小发生变化，GeometryReader 将重新布局。