Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6211

TapGestureHandler not triggering onGestureEvent but onHandlerStateChange triggers twice

$
0
0

I'm trying to use the react-native-gesture-handler library to add double click event when a picture is tapped.

the issue I'm running into is the onGestureEvent is never being triggered and onHandlerStateChange is being triggered twice even if I've only clicked it once. on one click it will trigger show the alert fade away then show the alert again.

the second part of this is my number of taps is 2 so it shouldn't event trigger on one tap. this is all wrapped within a flatlist if that matters.

                            renderItem={({ item }) => {
                            return (
                                <Fragment>
                                    {this.state.isExpandable && (

                                        <TapGestureHandler
                                            onHandlerStateChange={this.showImageOverlay}
                                            onGestureEvent={this.finalEvent}
                                            numberOfTaps={2}
                                        >
                                            <Image
                                                style={{ ...collapsibleImagesStyles.Image, height: 540 / 4, width: 540 / 2.2 }}
                                                source={{ uri: item }} />

                                        </TapGestureHandler>
                                    )
                                    }
                                </Fragment>
                            )

                        }}
                        keyExtractor={(item, index) => index.toString()}




    private finalEvent = (event: TapGestureHandlerGestureEvent) => {

    if (event.nativeEvent.state = State.BEGAN)
    alert(JSON.stringify('FINAL BEGAN'))
    if (event.nativeEvent.state = State.ACTIVE)
        alert(JSON.stringify('FINAL ACTIVE'))
    if (event.nativeEvent.state = State.END)
        alert(JSON.stringify('FINAL END'))
}

private showImageOverlay = (event: TapGestureHandlerStateChangeEvent) => {

    if (event.nativeEvent.state = State.ACTIVE)
        alert(JSON.stringify('ACTIVE'))
}

Viewing all articles
Browse latest Browse all 6211

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>