SwiftUI: How to remove margin between views in VStack?

Question

Using SwiftUI, I created a VStack, which contains some fixed elements and a list element. The reason is, that the user should only scroll the area under the fixed elements. Now I see a space between the second fixed element and the list. I don't know where this space is coming from and want to get rid of it, but have no idea, how. The area is marked in red.

struct DashboardView : View, CoreDataInjected {      var body: some View {         GeometryReader { geometry in             VStack {                 ScopeSelectorView().frame(maxWidth: .infinity).background(ColorPalette.gray)                 BalanceNumberView().frame(maxWidth: .infinity)                 List {                     DashboardNavigationView(                         height: geometry.size.height - ScopeSelectorView.height - BalanceNumberView.height                     ).frame(maxWidth: .infinity).listRowInsets(.zero)                 }             }         }.background(Color.red).edgesIgnoringSafeArea(.all)     } } 

Answer 1

Since you didn't pass a spacing argument to VStack, it is picking a default spacing based on context. If you want no spacing, pass 0 explicitly.

VStack(spacing: 0) {     // content here } 

Answer 2

Separately

You can use offset modifier on any view to make it looks different for each content separately:

VStack {     Circle()     Circle().offset(x: 0, y: -20)     Circle().offset(x: 0, y: 40) } 

Note that it could be negative in both directions.

---

All at once

Also VStack and HStack have an argument called spacing and you can set it to 0 or any other number you need to apply it to all elements.

VStack(spacing: 0) {     Circle()     Circle() } 

Note that is could be negative if needed.