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.

Answer 1

Separatly

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.

Answer 2

I use this,

.padding(.top, -8)

More detail here,

VStack(spacing: 0) {
   List { ...
   }
   VStack{ ... }.padding(.top, -8)
}

Answer 3

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
}