Roman Mahotskyi
Roman Mahotskyi

Reputation: 6645

How to create own ScrollView using DragGesture?

I'm trying to mimic ScrollView behaviour in my own custom component.

The thing I'm having trouble with is scroll animation. As far I understand I can use predictedEndTranslation object to get the predicted position of the drag gesture. But I don't know which easing function I should use to mimic default ScrollView easing.

Here is my code

struct ViewContent: View {
    @State var offsetY: CGFloat = 0

    var body: some View {
        View {

        }
        .offset(y: offsetY)
        .gesture(
          DragGesture()
            .onChange { value in
                offsetY = value.translation.height
            }
            .onEnded { value in 
                let nextScrollPosition = value.predictedEndTranslation.height

                withAnimation(???) { // What easing to use?
                    offsetY = nextScrollPosition
                }
            }
        )
    }
}

Upvotes: 1

Views: 430

Answers (1)

kevincrab
kevincrab

Reputation: 74

I would use .spring() as this preset animation will get you the closes to the generic scrollview animation.

withAnimation(.spring()) { // User .spring()
    offsetY = nextScrollPosition
}

Upvotes: 1

Related Questions