calling scrollTo multiple times with animation causes the scroll to overshoot and get out of sync

[CapsAdmin]

I'm using Carousel and some buttons calling carousel.scrollTo({index, animated: true}) to manually go to a specific item in the carousel.

If I press a button to scroll to a specific index while it's already animating to some other index, the container view seems to go out of sync. It's fixed if I manually scroll the view again with my fingers.

[CapsAdmin]

A workaround I found just now is doing this instead:

carousel.scrollTo({
	count: index - carousel.getCurrentIndex(),
	animated: true,
})

as opposed to just using the index field

[oliverloops]

Hi @CapsAdmin, In the API count is used to move with a specific fixed parameter. index value is also used as first scroll action and overrides count direct parameter. And is possible to know how you are changing the state of index values?

[wqcstrong]

Any solution? I met the same issue, and it is not related to passed count or index

[CapsAdmin]

Hi @CapsAdmin, In the API count is used to move with a specific fixed parameter. index value is also used as first scroll action and overrides count direct parameter. And is possible to know how you are changing the state of index values?

I think I understand the differences, but the problem seems to be using index while it's already animating.

This looks suspicious

react-native-reanimated-carousel/src/hooks/useCarouselController.tsx

Line 234 in ce2ee49

const offset = handlerOffsetX.value + (index.value - i) * size;

Maybe it should be using currentFixedPage() as prev and next above uses?

[dohooo]

Thx for your issue. fixed in v3.0.4.