SwiftUI ZStack：将某些子视图对齐到底部，并将某些对齐到顶部

Question

作为我的应用程序的根视图，我有一个ZStack，我想添加两个浮动条，一个位于视口底部，另一个位于顶部。
使用单个浮动条很容易（ZStack(alignment: .top)），但是否有一种方法可以添加多个后代，并将一个对齐到顶部，另一个对齐到底部？
我尝试从ZStack中删除alignment，并将.frame(alignment: .top)/.frame(alignment: .bottom)添加到子元素中，但这没有起作用。
是的，可以通过将一个顶部对齐的ZStack包装在另一个底部对齐的ZStack中来实现，但这似乎不太优雅。

- Tomáš Kafka

Answer 1

这里是可能的方法

ZStack {

 // content here

}
.overlay(YourTopView(), alignment: .top)
.overlay(YourBottomView(), alignment: .bottom)

其他可能的变体是使用一个 .overlay，其中包含两个视图的 VStack 和中间的 Spacer。

- Asperi

Answer 2

这里有另一种方法，可以允许顶部和底部对齐的视图重叠。

ZStack() {
    VStack() {
        topView()
        Spacer()
    }
    VStack() {
        Spacer()
        bottomView()
    }
}

- Bruce Webster

Answer 3

您可以像这样在ZStack中添加一个VStack。

ZStack {
    VStack {
        YourTopView()
        Spacer()
        YourBottomView()
    }
}

- Hieu Dinh

---

谢谢，这个也可以 - 我最初期望间隔块点击到底层内容，但显然并不是这样。 - Tomáš Kafka