Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Carousel horizontal swiping doesn't work when react-native-reanimated is on V 3.15.4 #700

Open
JordanHe opened this issue Oct 7, 2024 · 1 comment
Assignees
Labels
bug Something isn't working

Comments

@JordanHe
Copy link

JordanHe commented Oct 7, 2024

I was using react-native-reanimated@3.3.0 and my app worked fine for the code below

<Carousel
        loop={false}
        snapEnabled={true}
        panGestureHandlerProps={{
          activeOffsetX: [-10, 10],
        }}
        modeConfig={{
          parallaxScrollingScale: 0.9,
          parallaxScrollingOffset: 50,
        }}
        onSnapToItem={(index) => handleSelect(index)}
        ref={swiperRef}
        style={{
          width: screenWidth,
          justifyContent: "center",
          alignItems: "center",
          alignSelf: "center",
        }}
        width={screenWidth}
        data={[...new Array(items.length).keys()]}
        renderItem={({ index, animationValue }) => (
          <Item
            key={index}
            index={index}
            groups={groups}
            currentGroupIndex={
              parseInt(currentGroupIndex) ? parseInt(currentGroupIndex) : 0
            }
            animationValue={animationValue}
            unitPreference={unitPreference}
          />
        )}
      />

I then upgraded to react-native-reanimated@3.15.4

which caused the above carousel to stop swiping horizontally.
I also believe the .scrollTo() function doesn't work either.

I have downgraded back to react-native-reanimated@3.3.0 and its working again.

@JordanHe JordanHe added the bug Something isn't working label Oct 7, 2024
Copy link

dosubot bot commented Oct 7, 2024

Hey @JordanHe! 👋 I'm here to help you with any bugs, questions, or contributions you have while waiting for a human maintainer.

There is a known issue related to the .scrollTo() function in the react-native-reanimated-carousel repository, which was fixed in version 3.0.4. However, your issue seems to be related to compatibility with react-native-reanimated version 3.15.4, which might have introduced changes affecting the carousel's functionality [1].

While I couldn't find specific documentation or examples demonstrating compatibility with react-native-reanimated version 3.15.4, you might want to ensure that all dependencies are correctly set up. The peer dependencies for react-native-reanimated-carousel include react-native-reanimated version 3.0.0 or higher, so version 3.15.4 should be compatible [2].

Additionally, there are troubleshooting steps for swiping or gesture handling issues. You can configure the activeOffsetX of the gesture handler to ensure smooth swiping:

<Carousel
  {...}
  onConfigurePanGesture={gestureChain => (
    gestureChain.activeOffsetX([-10, 10])
  )}
/>

This configuration might help resolve the swiping issue [3]. If the problem persists, consider checking for any updates or patches in the react-native-reanimated-carousel repository that might address compatibility with the latest react-native-reanimated versions.

To continue talking to Dosu, mention @dosu.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants