如何在SwiftUI中向表单底部添加空白空间？

Question

我在SwiftUI中有一个模态表单用于添加记录。该模态表单使用多个TextField元素的表格。现在，我希望在表单的末尾添加与表单背景（灰色）相同颜色的一些空间。

将padding（）添加到最后一个TextField会导致所有TextField都有填充。然后我尝试在最后一个表单元素中添加Text（“”）.hidden（）。padding（.bottom，500），但是空间被白色背景颜色填充。

更新：如果您在Form视图中放置具有填充的间距，则会得到以下结果（演示背景为红色）：

这是代码：

import SwiftUI

struct ContentView: View {
    var body: some View {
        HStack {
            Text("Hello, World!")
        }
        .sheet(isPresented: .constant(true), content: { SheetView() }
        )
    }
}

struct SheetView: View {
    var body: some View {
        Form {
            TextField("Demo Field", text: .constant("KK"))
            Spacer()
                .padding(.bottom, 500)
                .background(Color(.red))
        }
    }
}

我需要的是与苹果的联系人应用程序相同。如果您进入"新建联系人"并向下滚动到表单末尾，那里有相当多的空间：

- G. Marc

---

尝试添加一个Spacer()。 - sfung3

很遗憾，这个不起作用。请查看我的更新描述。 - G. Marc

我在下面发布了一个更好的解决方案，根据您更新的描述。 - sfung3

Answer 1

为了实现这一点，您需要使用一个 section。

struct SheetView: View {
    var body: some View {
        Form {
            Section(header: Text("")) {
                TextField("Demo Field", text: .constant("KK"))
            }
            Section(header: Text("")) {
                EmptyView()

            }
            .padding(.bottom, 200)
            Section(header: Text("")) {
                TextField("Demo Field", text: .constant("KK"))
            }
        }
    }
}

结果：

- sfung3

---

就是这样！你能否稍微编辑一下你的源代码，因为第二个部分应该是空的，并添加填充。我用了这个，它可以正常工作：Section(header: Text("")) { EmptyView() }.padding(.bottom, 200) - G. Marc

请检查更新的答案。那是你想要的吗？ - sfung3

是的，不需要第二个文本字段，但这并不重要。谢谢！ - G. Marc

实际上，您不需要具有空标题文本和EmptyView。因此，您也可以只编写：Section {}。 - MathiasJ

这个可行，创建了一个 FormSpacer 视图并在其下编写了这个空白部分。现在我可以在我的表单中使用 FormSpacer() 了。 - Okhan Okbay

struct FormSpacer: View { var body: some View { Section(header: Text("")) { EmptyView() } } } - Okhan Okbay

Answer 2

考虑添加一个Spacer()，应如下所示：

Spacer()
  .padding(.bottom, 500)
  .background(gray)

- Steven Schafer

---

不幸的是，这也不起作用。如果您将间隔符放在表单视图内部，它只会创建另一行白色空间。如果您将其放在表单视图外部，它将不再随表单一起滚动。 - G. Marc