Add panGestureHandler props to Carousel

See original GitHub issue

Awesome stuff! Would it be possible to add panGestureHandler props to the Carousel?

e.g.

 <PanGestureHandler
            onHandlerStateChange={animatedListScrollHandler}
            {...panHandlerProps}
       ....

I can make PR if you give access 👍

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:9 (8 by maintainers)

github_iconTop GitHub Comments

2reactions
klandellcommented, Oct 21, 2021

@tristanfrantz Just wondering what props you used in panGestureHandlerProps. I have multiple carousels in a vertical ScrollView and that causes the swipe of the carousel to not work. I’m hoping changing those settings will fix it, but haven’t had luck yet.

Edit: Nevermind, figured it out. For anyone else searching for answers, I needed to use ScrollView from ‘react-native-gesture-handler’ instead of from ‘react-native’, and used the following gesture handler props in the Carousel.

panGestureHandlerProps={{
  activeOffsetX: [-10, 10],
  failOffsetY: [-10, 10],
}}
1reaction
dohooocommented, Oct 19, 2021

There is no problem with the submitted code,except I think the props type should be

handlerProps?: Omit<PanGestureHandlerProps,’onHandlerStateChange’>;

onHandlerStateChange Is key method 😄,

btw,why you can’t send pull request? I used another account to send a pull request, it worked.

Read more comments on GitHub >

github_iconTop Results From Across the Web

React passing props into custom carousel - Stack Overflow
What you should do instead, is allow yourself the flexibility to pass in any number of items to your Carousel component via props....
Read more >
react-native-reanimated-carousel - npm
Simple carousel component.fully implemented using Reanimated 2.Infinitely scrolling, very smooth.. Latest version: 3.0.6, last published: 8 ...
Read more >
Reanimated Carousel For React Native - ReactScript
A simple, infinitely scrolling React Native carousel using Reanimated 2. How to use it: 1. Install the package. # Yarn $ yarn add...
Read more >
Problem with slider inside BottomSheet on Android #145
In my example I'm using reanimated-bottom-sheet with react-native-snap-carousel inside ScrollView. I had to add state which we will be using ...
Read more >
PanGestureHandler | React Native Gesture Handler
Note that on both Android and iOS when the additional finger is placed on the screen that translation prop is not affected even...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found