SwiftUI - 如何将底部边缘与兄弟视图的中心对齐

Question

在阅读问题前，请先看一下这张图片

我目前正在尝试在SwiftUI视图中将红色视图的垂直中心(/ centerY)与绿色视图的底部对齐。

我之前使用过UIKit，可以用像viewA.centerYAnchor.constraint(toEqual: viewB.bottomAnchor)这样的代码解决问题。

但是，在SwiftUI中应该如何解决这个问题呢？我的视图层次结构类似于以下内容：

VStack {
    ZStack {
        Image("someImage")
        Text("Awesome Title") // <- align center to the Image's bottom edge
            .frame(width: 200, height: 130)

    }
    Spacer()
}

- RedX

Answer 1

我找到了解决方案：

1. 将ZStack的对齐方式设置为.bottom。现在红色视图将与绿色视图的底部对齐。感谢@Andrew。 但这还不够：

2. 将红色视图的.alignmentGuide设置如下:

   -> .alignmentGuide(.bottom) { d in d[.bottom] / 2 }

说明：现在绿色视图的底部边缘将与红色视图高度的50％对齐！ 太棒了！

- RedX

Answer 2

如果您从 text 中移除 frame 并为 ZStack 添加底部对齐，那么它将为您提供所需的效果。

        VStack {
            ZStack (alignment: .bottom) {
                Image("someImage")
                Text("Awesome Title") // <- align center to the Image's bottom edge
            }
            Spacer()
        }

结果：

结果：

- sfung3

---

但是，文本的底部边缘与图像的底部边缘对齐了。我想要的是将文本的垂直中心与图像的底部边缘对齐！ :) - RedX

这只是将底部对齐，而不是像问题所要求的那样居中 :) - yambo