snapToItem when enableSnap= false

[grean]

Hi all question for you :)

Is there a way in this lib to change the currentItem when enableSnap=false ? Because if i scroll to my list near the tenth for exemple, and then i apply a filter (ie : rest 5 items) i can see only a blank view.. but when i scroll towards the fifth rest items, they appear... (tried triggerRenderingHack(tried different values x) but the behavior is weird like only works to the third consecutive call.. ) When i use enableSnap=true and call myCarouRef.snapToItem(0) after filtering, it works and it brings me at the beginnig so items appear directly but i have to say that snap behavior is not a good experience in my opinion mostly if the user wants to scroll quick.

Any idea ?

[bd-arc]

Hi @grean,

Can you please provide a Snack example in which the issue can be reproduced?

Also, you might want to try using enableSnap={true} in conjunction with enableMomentum={true}; it might be closer to the behavior you're after (i.e. quick scrolling).

[pribeh]

This works

<Carousel
  ref={(c) => { this._carousel = c; }}
  data={this.props.MainStore.nextChallenges}
  keyExtractor={(item) => item._id}
  renderItem={this.challengeComponentRenderer}
  sliderWidth={screen.width}
  itemHeight={screen.height - 175}
  itemWidth={screen.width - 62}
//// These lines below are the trick
  enableMomentum={true}
  enableSnap={false}
  snapToInterval={screen.width - 62}
  decelerationRate={0.83}
  snapToAlignment={"start"}
/>

[dohooo]

Sorry, please allow me to advertise for my open source library! ~ I think this library react-native-reanimated-carousel will solve your problem. It is a high performance and very simple component, complete with React-Native reanimated 2

[react06]

@pribeh you saved my Day🥹!!

[react06]

@pribeh

I did the same, but I have text beneath the carousel Item instead of dots, can you please help that how can I get the current index(active item index) to onSnapToItem? Any Help will be appreciated.