Search code examples
swiftuixcode12swiftui-form

XCode 12 Beta 3 SwiftUI Space between sections on a form


How can I reduce the spacing between Sections on a form for the following view?

    var body: some View {
            Form {
                Section {
                    TextField("Name", text: $patient.name, onEditingChanged: { changed in
                        if !isNewPatient {
                            isSaveDisabled = false
                        }
                    }, onCommit: {
                        if !isNewPatient {
                            isSaveDisabled = false
                        }
                    })
                    .validation(patient.nameValidation)
                    TextField("Surname", text: $patient.surname)
                        .validation(patient.surnameValidation)
                    TextField("ID Number", text: $patient.id)
                        .validation(patient.idValidation)
                        .validation(patient.idRegexValidation)
                        .disabled(!self.isNewPatient)
                        .foregroundColor(isNewPatient ? .black : .gray)
                }
                Section {
                    TextField("Street Number and Name", text: $patient.street)
                    TextField("Suburb", text: $patient.suburb)
                    TextField("Area Code", text: $patient.postCode)
                        .validation(patient.postCodeRegexValidation)
                }.isHidden(isDependant, remove: true)
                Section {
                    Picker("Medical Aid", selection: $patient.medicalAidName) {
                        ForEach(medicalAids, id: \.self) {
                            Text($0)
                        }
                    }
                    TextField("Medical Aid Number", text: $patient.medicalAidNo)
                }.isHidden(isDependant, remove: true)
                Section {
                    Button("Save") {
                        if isNewPatient {
                            if patient.create(moc: moc, isDependant: isDependant, mainID: self.mainID) {
                                isDependantsActive.toggle()
                            }
                        } else {
                            if patient.update(moc: moc) {
                                self.presentationMode.wrappedValue.dismiss()
                            }
                        }
                    }.disabled(self.isSaveDisabled)
                }
                NavigationLink("Dependants", destination:
                                DependantListView(filter: mainID).environment(\.managedObjectContext, moc), isActive: $isDependantsActive
                ).disabled(isNewPatient).isHidden(isDependant, remove: true)
            }
            .onReceive(patient.allRequiredValidation) { validation in
                if isNewPatient {
                    self.isSaveDisabled = !validation.isSuccess
                }
            }
            .navigationBarTitle(title, displayMode: .inline)
    }
}

This is how the form looks:

Sections in a Form

I've had a look at the following answers but they're not acceptable: Spacing between sections in a form


Solution

  • Try to add the following in the View containing Form

    init() {
        UITableView.appearance().sectionHeaderHeight = .zero
    }