SwiftUI 测量视图的高度

Question

我尝试使用 coordinatespace 测量视图的高度，但 returns 的值是全屏的高度。知道为什么我的代码没有给我想要的东西吗？

struct GeoReader: View {
    var body: some View {
        GeometryReader { geo in
            VStack {
                ZStack {
                    Rectangle()
                        .foregroundColor(.blue)
                    Text("Heigt of full screen is \(geo.size.height)")
                }
                ZStack {
                    Rectangle()
                        .foregroundColor(.red)
                        .coordinateSpace(name: "Redbox")
                    Text("Height of red box is \(geo.frame(in: .named("Redbox")).height)")
                }
            }
        }
    }
}

Answer 1

几何体 reader 测量整个屏幕，因为您将几何体 reader 放在视图主体的正上方。因此它将读取视图的几何结构 returns。在这种情况下整个屏幕。

如果你想得到两个矩形的大小，你应该把几何体 reader 放在矩形和文本的 Stack 中。

struct GeoReader: View {
    var body: some View {
        GeometryReader { geo1 in
            VStack {
                ZStack {
                    Rectangle()
                        .foregroundColor(.blue)
                    Text("Heigt of full screen is \(geo1.size.height)")
                }
                ZStack {
                    GeometryReader { geo2 in
                        Rectangle()
                            .foregroundColor(.red)
                            .coordinateSpace(name: "Redbox")
                        Text("Height of red box is \(geo2.frame(in: .named("Redbox")).height)")
                    }
                }
            }
        }
    }
}

Answer 2

显示尺寸为内视图容器全视图的尺寸。

您需要使用另一个 GeometryReader 来获取第二个 ZStack 的内部尺寸。

struct ContentView: View {
    var body: some View {
        GeometryReader { geo in
            VStack {
                ZStack {
                    Rectangle()
                        .foregroundColor(.blue)
                    Text("Heigt of full screen is \(geo.size.height)")
                }
                GeometryReader { innterGeo in //<Here
                    ZStack {
                        Rectangle()
                            .foregroundColor(.red)
                            .coordinateSpace(name: "Redbox")
                        Text("Height of red box is \(innterGeo.frame(in: .named("Redbox")).height)")
                    }
                }
            }
        }
    }
}

如果你需要在任何地方使用它，那么你可以使用这个方法。

首先，创建一个结构并使用 GeometryReader 包装您的内容。

struct GeometryContentSize<Content: View>: View {
    public var content: (CGSize) -> Content
    
    var body: some View {
        GeometryReader { geo in
            content(geo.size)
        }
    }
}

用法：

struct ContentView: View {
    var body: some View {
        GeometryReader { geo in
            VStack {
                ZStack {
                    Rectangle()
                        .foregroundColor(.blue)
                    Text("Heigt of full screen is \(geo.size.height)")
                }
                
                GeometryContentSize { (size) in //<--- Here
                    ZStack {
                        Rectangle()
                            .foregroundColor(.red)
                        Text("Height of red box is \(size.height)")
                    }
                }
            }
        }
    }
}

SwiftUI 测量视图的高度

SwiftUI measuring the height of a view

swiftui

geometryreader