How to swipe and navigate screens?

Question

I have created an application, where I need to need to swipe in order to navigate from one screen to another, have used bottomtabnavigator, however that does not seem to work, next came up through gesture handlers, even that does not seem to work

The snippet for navigation right now is:

 import GestureRecognizer from 'react-native-swipe-gestures';

The function:

 onSwipeLeft() {
        this.props.navigation.navigate('Product')
      }

This function is called inside:

<GestureRecognizer 
    onSwipeLeft={this.onSwipeLeft}/>

Does anyone have any idea or suggestion how am I supposed to do it any other way? Do tell me if you require anything else.

Answer 1

You have to use Gesturerecognizer in everyscreen and on SwipeLeft and SwipeRight what you can do is navigate to different page.

Suppose:

Home render --

onSwipeLeft() {
        this.props.navigation.navigate('Product')
      }
render(){
return(
<GestureRecognizer 
    onSwipeLeft={this.onSwipeLeft}/>

)

}

And now once you are in product you can do :

onSwipeLeft() {
            this.props.navigation.navigate('Cookies')
          }

onSwipeRight(){
this.props.navigation.goBack()
}
    render(){
    return(
    <GestureRecognizer 
        onSwipeLeft={this.onSwipeLeft}/>
        onSwipeRight={this.onSwipeRight}/>
    )

    }

Hope it helps.