Navigation Issue while navigating using Android Hardware Back Press [react-native]

Question

When I navigate to the first screen from the final screen of my App using hardware back press
It initially navigates to first screen and also bounces back to the final screen

Also the animation that I have given in the first screen becomes a stuck and play like experience while navigating and this case is same for both types of navigation ie.,

-navigating with the back button in App and also while using hardware back press

This is my final screen js file where I handle hardware back press:

constructor(props) {
  super(props);
  this.handleBack = (() => {
    Actions.FirstScreen();
  });
 }

  componentDidMount() {
    BackHandler.addEventListener('hardwareBackPress', this.handleBack);
  }

  componentWillUnmount() {
   BackHandler.removeEventListener('hardwareBackPress', this.handleBack);
 }

and this is the first screen's js file where I have the animation:

  componentWillMount() {
    this.slide1 = new Animated.Value(0);
    this.slide2 = new Animated.Value(0);
    this.bnt1();
    this.bnt2();
 }

 bnt1() {
       Animated.timing(
         this.slide1, {
           delay: 100,
           toValue: w / 1.33,
           duration: 700,
       }
       ).start();
     }

     bnt2() {
           Animated.timing(
             this.slide2, {
               delay: 700,
               toValue: -(w / 1.33),
               duration: 500,
           }
           ).start();
         }

Adarsh Sreeram Adarsh Sreeram · Accepted Answer · 2017-11-13T06:31:55

In your final screen js file add this:

constructor(props) {
     super(props);
      this.handleBack = (() => {
        Actions.FirstScreen();
        return true;
       });
      }

Navigation Issue while navigating using Android Hardware Back Press [react-native]

1 Answers