swift - VStack 中意外的 GeometryReader View 行为

Question

有人可以解释为什么:GeometryReader将其内容放置在左上角，而不是中心。GeometryReader占用所有可用空间。

struct ContentView: View {
    var body: some View {
        VStack(alignment: .center) {
            GeometryReader { geo in
                    Text("Hello, World!")
                        .frame(width: geo.size.width * 0.7, height: 40)
                        .background(Color.red)
            }
            .background(Color.yellow)

            Text("More text")
                .background(Color.blue)
        }
    }
}

这是它的外观:

我希望它定位 Text “你好，世界” View 在中心。

Answer 1

首先，您需要进行一些关键的更改以获得您所期望的。它出现这样的原因是因为您没有按照您认为应该使用的方式使用 Geometry Reader。 Geometry reader 本质上是一种获取父 View 大小的方法。 通常，您不会使用它来布局 View ，并且仍然坚持使用嵌套在几何读取器内部的 VStack、ZStack 和 HStack。这是因为读取器扩展以在 X and Y 中占据尽可能多的空间。飞机。执行您期望的操作的典型结构可能如下所示。最终将“Hello World”集中在几何阅读器的中心。

GeometryReader { reader in 
    VStack {
         Spacer()
         HStack {
             Spacer()
             Text("Hello World")
             Spacer()
         Spacer()
    }
}