UPGRADE YOUR SKILLS: Learn advanced Swift and SwiftUI on Hacking with Swift+! >>

SOLVED: How to create space between sections inside a form?

Forums > 100 Days of SwiftUI

Hello everyone.

            Form {
                Section {
                    NavigationLink {
                        AddMealData()
                    } label: {
                        Text("Enter meal data")
                    }

                    NavigationLink {
                        AddExerciseData()
                    } label: {
                        Text("Enter training data")
                    }
                } header: {
                    Text("Please enter the calory data")
                }
                Section {
                    NavigationLink {
                        ShowDataView()
                    } label: {
                        Text("Data history")
                    }
                } header: {
                    Text("See history of your data")
                }
                AsyncImage(url: URL(string: "https://www.macworld.com/wp-content/uploads/2023/01/how-to-use-apple-health-main2.png?w=1024")) { image in
                    image
                        .resizable()
                        .scaledToFit()
                        .clipShape(RoundedRectangle(cornerRadius: 30))
                        .overlay(
                            RoundedRectangle(cornerRadius: 30)
                                .stroke(.white.opacity(0.5))
                        )
                } placeholder: {
                    ProgressView()
                }
                .frame(width: 450, height: 210)
            }

So how to do it?

2      

One way would be to add padding. What kind of result do you want?

Section {
      NavigationLink {
             Text("Add")
      } label: {
             Text("Data history")
      }
} header: {
      Text("See history of your data")
           .padding(.top, 50)
}

EDIT: Moved the padding inside the header closure.

2      

@magnas35 thank you for the reply! I just want to create more space between each section. Padding only makes the section itself strech but i want it to stay the same but there is more space between the sections.

                LazyVStack(alignment: .leading, spacing: 30) {
                    Text("Total calories taken in: ")
                    Text("Exercises done: ")
                    Text("Total time trained: ")
                }

Something like this for example I want. But I cant put spacing on a Form

2      

Sorry, I placed the padding in the wrong place. By attaching it to the header text there is now space between the "Enter" section and the "History" section. Or do you mean extra spacing inside each section?

2      

Thanky you both.

2      

TAKE YOUR SKILLS TO THE NEXT LEVEL If you like Hacking with Swift, you'll love Hacking with Swift+ – it's my premium service where you can learn advanced Swift and SwiftUI, functional programming, algorithms, and more. Plus it comes with stacks of benefits, including monthly live streams, downloadable projects, a 20% discount on all books, and free gifts!

Find out more

Sponsor Hacking with Swift and reach the world's largest Swift community!

Archived topic

This topic has been closed due to inactivity, so you can't reply. Please create a new topic if you need to.

All interactions here are governed by our code of conduct.

 
Unknown user

You are not logged in

Log in or create account
 

Link copied to your pasteboard.