斯威夫特用户界面。如何为 Spacer 设置收缩行为？

Question

如果容器 (VStack) 与底部黑色视图不冲突，如何设置 rgb 视图 (100pt) 之间的默认间距。（如 iPhone 11 Pro Max）。但如果没有 100p 高度的空间，则会缩小。（如屏幕截图中的 iPhone SE）

我的代码：

struct ContentView: View {
    var body: some View {
        VStack(spacing: 0) {
            VStack(spacing: 0) {
                Rectangle()
                    .foregroundColor(.red)
                    .frame(height: 100)
                Spacer()
                    .frame(minHeight: 10, maxHeight: 100)
                Rectangle()
                    .foregroundColor(.green)
                    .frame(height: 100)
                Spacer()
                    .frame(minHeight: 10, maxHeight: 100)
                Rectangle()
                    .foregroundColor(.blue)
                    .frame(height: 100)
            }
            Spacer()
                .frame(minHeight: 10, maxHeight: 600)
            Rectangle() // keyboard
                .frame(height: 200)
        }
    }
}

所以问题是： 在 iPhone 11 Pro Max 上，具有 maxHeight: 100 的垫片的高度 = 10（不是 100）。（但黑色视图和 VStack 之间的空间允许）

如何做出我解释过的行为？

Answer 1

您需要idealHeight与s.fixedSize修饰符一起使用Spacer：

Spacer()
    .frame(minHeight: 10, idealHeight: 100, maxHeight: 600)
    .fixedSize()

Answer 2

使用 Spacer(minLength: 10) 作为最后一个间隔符。

struct ContentView: View {
    var body: some View {
        VStack(spacing: 0) {
            VStack(spacing: 0) {
                Rectangle()
                    .foregroundColor(.red)
                    .frame(height: 100)
                Spacer()
                    .frame(minHeight: 10, maxHeight: 100)
                Rectangle()
                    .foregroundColor(.green)
                    .frame(height: 100)
                Spacer()
                    .frame(minHeight: 10, maxHeight: 100)
                Rectangle()
                    .foregroundColor(.blue)
                    .frame(height: 100)
            }
            Spacer(minLength: 10)
            Rectangle() // keyboard
                .frame(height: 200)
        }
    }
}

代码中的问题是，当您将 Spacer 包装在像 之类的框架内时Spacer().frame(minHeight: 10, maxHeight: 600)，它首先被视为框架，然后是该框架内的 Spacer。框架与其他视图具有相同的默认布局优先级。因此，父级将建议它与内部 VStack 具有相同数量的空间。通过删除框架修改器，间隔器具有最低的布局优先级，因此内部 VStack 将占用尽可能多的空间，除了间隔器占用的最小 10 点和矩形的 200 点之外。