facing flickering issue when scrolling from last item to first item in android and intermittently in ios

[christopher-18]

when i am scrolling from my last image to first image or vice-versa , there is some flickering if the image in android. But in iOS it is happening intermittently. Also, those images are not getting loaded.

<Carousel
                       data={topCarouselImages}
                       renderItem={this._renderItem}
                       sliderWidth={screenWidth}
                       itemWidth={screenWidth}
                       loop={true}
                       loopClonesPerSide={5}
                       onSnapToItem={(index) => this.setState({ activeSlide: index })}
                   />

    _renderItem({ item, index }) {
        l        return (
            <View style={{ height: "100%", width: screenWidth }}>
                <Image
                    source={{ uri: item, cache: 'reload' }}
                    onLoadEnd={() => this.hideIndicatorAfterCarouselLoad(index)}
                    style={{ width: "100%", height: "100%", resizeMode: "stretch" }} />
            </View>
        );
    }

[Rojal17]

Any Fix found?

[Dimasprog]

Some fix?

[15110011]

any solution?

[bear1030]

@15110011

Remove loop prop and try.

That fixed the issue for me.

[15110011]

@15110011

Remove loop prop and try.

That fixed the issue for me.

to me it didnt work. thanks btw

[Vidhiyakar]

Removing loop property worked. But I want the loop behaviour.

Anyone found a hack (or) a workaround to fix this issue.? I'm using v3.9.0 btw.

[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

[ggepenyan]

the same issue appears on 4.0.0-beta.6

[ggepenyan]

seems like the package is not being maintained anymore.