How to set contentInset of a ScrollView in SwiftUI

user_13781949 0
Viewed 9845

I can't seem to find how to set the contentInset of a ScrollView. My goal is to make the last object in my ScrollView above the Purple Main Button.

https://i.stack.imgur.com/QfjZb.jpg

If there is a command, could someone help how to implement this into my current code below. I would appreciate your help!

struct Overview: View {
    var body: some View {
        
        NavigationView {
            
            ScrollView(showsIndicators: false) {
                VStack(spacing: 10) {
                    ForEach(0..<5) {
                        Text("Item \($0)")
                            .foregroundColor(.white)
                            .font(.largeTitle)
                            .frame(width: 340, height: 200)
                            .background(Color("Boxes"))
                            .cornerRadius(10)
                    }
                }
                .frame(maxWidth: .infinity)
            }
            .navigationBarHidden(false)
            .navigationBarTitle("Overview", displayMode: .automatic)
        }
    }
}
swiftui swift uiscrollview
4 Answers

Just add a padding to the VStack embedded inside the ScrollView.

Using paddings with the embedded stacks provides the same behaviour as content insets.

ScrollView(showsIndicators: false) {
    VStack(spacing: 10) {
        // Some content //
    }
    .padding(.bottom, 200)    // Choose a value that works for you
}
user_81508740

You could put an invisible view underneath your ScrollView content and give it bottom padding.

For example with Color.clear and a bottom-padding of 300.

struct Overview: View {
    var body: some View {
        
        NavigationView {
            
            ScrollView(showsIndicators: false) {
                VStack(spacing: 10) {
                    ForEach(0..<5) {
                        Text("Item \($0)")
                            .foregroundColor(.white)
                            .font(.largeTitle)
                            .frame(width: 340, height: 200)
                            .background(Color("Boxes"))
                            .cornerRadius(10)
                    }

                    Color.clear.padding(.bottom, 300)
                }
                .frame(maxWidth: .infinity)
            }
            .navigationBarHidden(false)
            .navigationBarTitle("Overview", displayMode: .automatic)
        }
    }
}
user_87000440

iOS 15's SwiftUI now has a safeAreaInset modifier.
It's also correctly adjusts scroll bars.

ScrollView(.vertical, showsIndicators: true) {
    // scrollview's content
}
.safeAreaInset(edge: .bottom, spacing: 0) {
    // some bottom-sticked content, or just –
    Spacer()
        .frame(height: 44)
}
user_8267160

In iOS 15 I just add negative padding to the VStack.

struct Overview: View {
    var body: some View {
        
        NavigationView {
            
            ScrollView(showsIndicators: false) {
                VStack(spacing: 10) {
                    ForEach(0..<5) {
                        Text("Item \($0)")
                            .foregroundColor(.white)
                            .font(.largeTitle)
                            .frame(width: 340, height: 200)
                            .background(Color("Boxes"))
                            .cornerRadius(10)
                    }
                    .padding(.top, -50)
                }
                .frame(maxWidth: .infinity)
            }
            .navigationBarHidden(false)
            .navigationBarTitle("Overview", displayMode: .automatic)
        }
    }
}
user_171661270
Related