0

我的一个观点有一个分组List,我喜欢在最后一行下方放置一个按钮。这是代码:

var body: some View {
    VStack() {
        List {
           Text("Hello World")
           Text("Hello World")
           Text("Hello World")
           Text("Hello World")
        }
        .listStyle(GroupedListStyle())

        Button("Button") {}
    }
    .navigationBarTitle("Hello World", displayMode: .inline)
}

问题:按钮总是显示在屏幕底部。我尝试添加垫片,向 中添加间距修饰符VStack,但按钮始终位于底部:

在此处输入图像描述

相反,我希望按钮位于列表下方,并留有一些间距。

我怎样才能做到这一点?

4

1 回答 1

1

当然,我在发布问题后很快找到了解决方案。我将部分添加到列表中,然后将按钮放在第二部分的页脚中。我还删除了不再需要的VStack.

var body: some View {
    List {
        Section {
           Text("Hello World")
           Text("Hello World")
           Text("Hello World")
           Text("Hello World")
        }
        
        Section(footer:
            HStack(alignment: .center) {
                Spacer()

                Button("Button") {
                    print("tapped button")
                }
                Spacer()

        }) {
            EmptyView()
        }
    }
    .listStyle(GroupedListStyle())
    .navigationBarTitle("Hello World", displayMode: .inline)
}

结果:

在此处输入图像描述

于 2020-08-20T00:15:56.203 回答