如何使一个视图的中心与 SwiftUI 中另一个视图的顶部对齐？

Question

所以我想要一个与另一个视图重叠的视图，并且它的中心 Y 与其所在视图的顶部对齐。

UIKit 中的类似布局约束如下：

let topView: UIView...
let bottomView: UIView...

NSLayoutConstraint.activate([
    topView.centerYAnchor.constraint(equalTo: bottomView.top)
])

我怎样才能实现这一点？

Answer 1

一种可能的方法是使用alignmentGuide修饰符，它允许将特定的内部对齐线适合父容器。因此，默认情况下，容器具有中心对齐方式，因此对其中一个视图使用顶部锚点会导致其他视图的中心与顶部对齐。

使用 Xcode 13.2 / iOS 15.2 进行测试

struct DemoView: View {
    var body: some View {
        ZStack {
            Rectangle().fill(.red)
                .frame(width: 300, height: 200)
                .alignmentGuide(VerticalAlignment.center) {   // << here !!
                    $0[VerticalAlignment.top]
                }
            Rectangle().fill(.green)
                .frame(width: 100, height: 80)
        }
        .border(Color.black)
    }
}