Search code examples
flutterflutter-navigation

Navigation Route not removed or Pop


Currently I am doing a security settings page on my app. Now the issue I am getting is when I am navigating back or pressing back button. The pages are still navigating even pop.

I my code I am using this for going to the first flow

Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => otp_mPin())

Now on the Second or back flow I have used this

Code used for second flow

On the OTP page I used pop it and push

Navigator.of(context).pop();
Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => mPin())

Here is the flow that I am getting

Screen 1 Settings Page

 onTap: (){
                Navigator.push(context, MaterialPageRoute(builder: (context) => ProtectPhone()));
              },

Screen 2 Page with Password

Navigation for success password

   onPressed: (){
            Navigator.pop(context);
            Navigator.push(context, MaterialPageRoute(builder: (context) => selectScreenLock()));
          },

Back button / willPop

Navigator.pop(context);

Screen 3 Selection

Select or click MPin which will redirect to OtpMpin page

  Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => OtpMpin())
                );

Back or willpop command

  Navigator.of(context).pop();
  Navigator.push(
      context,
      MaterialPageRoute(builder: (context) => ProtectPhone())
  );

Secreen 4 OTP

Success OTP Input

 Navigator.pop(context);
                      Navigator.push(context, MaterialPageRoute(builder: (context) => setMPin()));

Screen 5 MPIN

Back or Willpop command

        Navigator.of(context).pop();
      Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => selectScreenLock())

First Flow

1 > 2 > 3 > 4 > 5

Second or back flow

5 > 3 > 2 > 4 > 2 > 1


Solution

  • Use pushReplacement method in 3rd page to 4th page so that while navigating from 3rd page to 4th page, 3rd page is removed from stack and pushed to 4th page. so if user pressing back button in 4th page then user will get second page.

    Navigator.pushReplacement(context,
                    MaterialPageRoute(builder: (context) {
                  return NewPage();
                }));