如何删除 swiftui 上列表视图的底部空间

Question

I want to remove the empty space below list element. Height has to be dynamic for list rows. If I remove the list, then the content will start from the bottom.

Here is code:

    var body: some View {
        
            VStack{
                Spacer()

                HStack{
                    Text(orderDetails.orderNumber ?? "").bold()
                    Spacer()
                }
                List{
                    Section(header: ListHeader()) {
                        ForEach(paidDetails.indices,id:\.self) { i in
                            HStack {
                                Text("Paid By:")
                                Spacer()
                                Text(paidDetails[i].name ?? "")
                                Spacer()
                                Text((paidDetails[i].amountCollected))   
                            }
                        }
                        
                    }
                }
                                    
                Button(action: {
                    presentationMode.wrappedValue.dismiss()
                }, label: {
                    Text("Close".localized).bold()    
                })
                .background(Color("CallCustomerBG")) 
            }   
        }
}

Answer 1

You can add that button to the section footer like so:

Section(header: ListHeader(), footer: {
    Button(action: {
        presentationMode.wrappedValue.dismiss()
    }, label: {
        Text("Close".localized).bold()
    })
    .background(Color("CallCustomerBG"))
}) {
    ForEach(paidDetails.indices,id:\.self) { i in
        HStack {
            Text("Paid By:")
            Spacer()
            Text(paidDetails[i].name ?? "")
            Spacer()
            Text((paidDetails[i].amountCollected))
        }
    }
}