SwiftUI ScrollView can't scroll down to all the content of ZStack

SwiftUI ScrollView can't scroll all down to all the content of the included ZStack.

struct TestView: View {
    var colors: [Color] = [.red, .orange, .yellow, .green, .mint, .teal, .cyan, .blue, .indigo, .purple, .pink, .brown ]

    var body: some View {
        ScrollView {
            ZStack {
                ForEach(0..<10) {i in
                    RoundedRectangle(cornerSize: CGSize(width: 30, height: 30))
                        .fill(colors[i])
                        .frame(width: 300, height: 300 )
                        .offset(x: 0, y: CGFloat(i) * 200)
                }
            }
        }
    }
}

The problem you have is from using ZStack and offset together. offset doesn't adjust the frame of the view. If you set the background color of your ZStack, you will notice it doesn't contain all of the rectangles.

Also, the default alignment of a ZStack is .center which would not be what you want.

To fix your problem, there are many things you can do. For one, you can add a vertical padding to each view, in place of the offset. Also set the alignment of the ZStack the top:

    var body: some View {
        ScrollView() {
            ZStack(alignment: .top) {
                ForEach(0..<colors.count) { index in
                    RoundedRectangle(cornerRadius: 30)
                        .fill(colors[index])
                        .frame(width: 300, height: 300)
                        .padding(.top, CGFloat(index) * 100)
                }
            }
        }
    }