first item is not opening the index which i pass

[Najaf-Rai]

Is this a bug report, a feature request, or a question?

(Write your answer here.)

Have you followed the required steps before opening a bug report?

yes (Check the step you've followed - put an x character between the square brackets ([]).)

• [] I have read the guidelines regarding bug report.
• [] I have reviewed the documentation in its entirety, including the dedicated documentations :books:.
• [] I have searched for existing issues and made sure that the problem hasn't already been reported.
• [] I am using the latest plugin version.
• [] I am following the issue template closely in order to produce a useful bug report.

Have you made sure that it wasn't a React Native bug?

(Write your answer here.)

Is the bug specific to iOS or Android? Or can it be reproduced on both platforms?

(Write your answer here and specify the iOS/Android versions on which you've been able to reproduce the issue.)

Is the bug reproductible in a production environment (not a debug one)?

(Write your answer here.)

Environment

(Write your answer here.)

Expected Behavior

(Write what you thought would happen.)

Actual Behavior

(Write what happened. Add screencasts/screenshots!)

Reproducible Demo

(Paste the link to a Snack example in which the issue can be reproduced. Please follow the guidelines for providing a Minimal, Complete, and Verifiable example.)

Steps to Reproduce

(Write your steps so that anyone can reproduce the issue in the Snack demo you provided.)

[Najaf-Rai]

i have a tab screen there i,m showing few item of the list on tab screen... when user click one of item i pass the whole array and index number through props on next screen where i have set carousel.. its working pretty fine The only issue is i think in first item its not opening the index which i pas at start. here is my code

                  <Carousel
                        layout="default"
                        layoutCardOffset={20}
                        ref="isCarousel"
                        data={this.state.storiesList}
                        firstItem={this.state.sliderActiveSlide}
                        initialScrollIndex={this.state.sliderActiveSlide}
                        onSnapToItem={(index) => this.setState({ sliderActiveSlide: index })}
                        sliderWidth={SLIDER_WIDTH}
                        itemWidth={ITEM_WIDTH}
                        inactiveSlideShift={0}
                        useScrollView={true}
                        loop={true}
                        autoplay={true}
                        autoplayDelay={2000}
                        autoplayInterval={3000}

/>

Urgent help needed

[mikeislearning]

@Najaf-Rai I have a similar issue, where it would stop working the length of carousel went past 7.

useScrollView ended up being my fix, but I found another fix

Using initialScrollIndex to match firstIndex, like you had. I also added:

        getItemLayout={(_data, index) => (
             length: SLIDER_WIDTH,
             offset: SLIDER_WIDTH * index,
             index,
           })}

As a prop, and that did the trick

[dohooo]

@Najaf-Rai 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

[cactisolutions]

I'm having this same issue

[DebbieL]

@Najaf-Rai I have a similar issue, where it would stop working the length of carousel went past 7.

useScrollView ended up being my fix, but I found another fix

Using initialScrollIndex to match firstIndex, like you had. I also added:

        getItemLayout={(_data, index) => (
             length: SLIDER_WIDTH,
             offset: SLIDER_WIDTH * index,
             index,
           })}

As a prop, and that did the trick

I have the same problem, your solution is right👍