Android will not snap / snap callback when pulling towards index 0.

Is this a bug report or a feature request?

Bug Report

Have you read the guidelines regarding bug report?

Yes.

Have you read the documentation in its entirety?

Yes.

Have you made sure that your issue hasn’t already been reported/solved?

Read through all open/closed issues using keywords ‘android’ and ‘snap’

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

Android

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

Both in release and development builds, this issue comes up

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

I cannot find an issue that relates to my current issue.

Have you been able to reproduce the bug in [the provided example]

Yes. https://snack.expo.io/@nlwizkus/snapcarouselissue

Environment

Environment: React: ^16.2.0 React native: ^0.53.3 react-native-snap-carousel: ^3.7.2

Target Platform: Android (7.1)

Expected Behavior

Pulling past index 0 will snap to index 0, and the callback will fire.

video of ios: https://vimeo.com/user66774081/review/280244549/386e720eb6

Actual Behavior

When I pull down on the carousel, if I pull past the first item (index 0), the carousel refuses to snap. If I slightly towards index 1 afterwords, it will snap. If I pull slightly before (in-between 0 and 1) it will snap. Here is a video of what it is currently doing. There are animations in these examples but ignore that since I’ve tried this with those commented out. I’ve logged within the onSnap callback and it is not firing.

broken on android: https://vimeo.com/user66774081/review/280241289/9b73b34a23 (sorry, the mouse is in the middle of the screen since this was screen cast from a device. I’m doing the exact same motions as is shown in the ios video)

note: my issue isn’t that it doesn’t pull like it does in the ios, ie: going past the snap point on the beginning/end index. My issue is that the onSnapToItem doesn’t get called when I pull past index 0 on android.

Reproducible Demo

    public render(): JSX.Element {
        return (
            <View style={styles.flexOne}>
                <Carousel
                    ref={(ref: any) => (this.carousel = ref)}
                    data={this.props.pickerOptions}
                    firstItem={START_INDEX} // 2
                    onSnapToItem={(index) => {
                        console.log('SNAP!', index);
                        this.props.onSelectRating(this.props.pickerOptions[index]);
                        this.setState({ activeCardIndex: index });
                    }}
                    enableSnap={true}
                    renderItem={this.renderItemForCarousel}
                    vertical={true}
                    itemHeight={(sliderHeight / this.props.pickerOptions.length) * 0.9}
                    sliderHeight={sliderHeight * 1.1} // ( * 1.1 fixes an issue with not snapping to last index)
                    inactiveSlideOpacity={0.5}
                    inactiveSlideScale={0.7}
                    slideStyle={styles.flexOne}
                    // scrollInterpolator={(i, p) => getScrollInterpolator(i, p)}
                    // slideInterpolatedStyle={(i, v) => getSlideInterpolatedStyle(i, v)}
                />
            </View>
        );
    }

    private renderItemForCarousel = (props: { item: Rating; index: number }) => {
        return (
            <TouchableOpacity onPress={() => this.pressedOption(props.index)} style={styles.container}>
                <Image style={styles.itemImage} source={ORDERED_PICKER_NUMBER_IMAGES[props.index]} />

                <Fade visible={props.index === this.state.activeCardIndex} style={styles.textContainer} duration={500}>
                    <Text style={styles.carouselText}>{this.state.activeCardIndex !== props.index ? '' : props.item.feeling}</Text>
                </Fade>
            </TouchableOpacity>
        );
    };

[bd-arc]

@nlwiskus Just a quick update: I’m currently working on replacing the FlatList component altogether (see #250) because I’m fed up with the incredible amount of bugs it carries.

My hope is that it will help solving your issue.

[bd-arc]

Hey @nlwiskus,

Sorry to hear that this prevents you from finishing your app. I should be able to take a look at the issue on Monday.

In the meantime, you can run a few tests to try and discover what’s preventing this._onSnap() from being called in _onScroll().

Let’s keep each other posted 😉