Enable ScrollView over scroll in SwiftUI

Question

I've implemented a vertical scroll view (using List) containing two horizontal scroll views (using ScrollViews). The UI currently looks like this:

Here's the relevant code I've written to produce above UI:

NavigationView {
    List {
        VStack(alignment: .leading) {
            CategoryRow(...)
            CategoryRow(...)
            Spacer()
        }
        .listRowInsets(EdgeInsets())
        .navigationBarTitle(Text("Featured"))
    }
}

Inside each CategoryRow, there's an HStack embedded inside a ScrollView.
When introducing a padding on the left & right edges, I get this result:

As you can see, as a result of the padding, the horizontal scroll views are cut-off.

Question

Is there a way to have the horizontal scroll views over-scroll past their boundaries?
The result I am looking for is that there is padding on the left of the scroll views when the scroll offset is 0 and padding on the right when the scrolling all the way to the right.

In UIKit, I did this by setting the contentOffset of the collection view...

I am not sure it is clear for me what the result do you expect. Do you won't to automatically scroll to some item onAppear? — DenFav
@jsbeginnerNodeJS If I remove the padding on the right and scroll all the way to the right, the last item will have no padding on the right, but be on the border of the screen directly. — LinusGeffarth
What about adding padding on the right side in the row itself. — SwiftiSwift

DenFav DenFav · Accepted Answer · 2019-06-09T13:47:36

7

votes

Add the padding modifier to your HStack inside the RowView

.padding(.horizontal, 20)

Enable ScrollView over scroll in SwiftUI

Question

1 Answers