Flutter navigation, reopen page instead of pushing it again

老子叫甜甜 提交于 2021-01-02 07:01:10

问题


I'm new to flutter and I'm working on an App that have multiple screens.

I would like to know to stop flutter from creating multiple screens of the same route, for example I have Page 1 and Page 2, if I click on the button to navigate to Page 2 and clicked again on the same button the application will push a new screen of Page 2 and i will have it twice and if I click on the return button it will send me back to the first created Page 2

is there a way to create every page only once and then reopen it if it's already pushed to the stack ?

I'm using Navigator.push for all my navigation


回答1:


Using a simple logic here

  1. If the new page is the same as the current page then use Navigator.push(context,route).

  2. If the new page is the different then use Navigator.pushReplacement(context,route).


In case if you are using named routes then for

  1. same page as current, use Navigator.pushNamed(context,name).
  2. different page, use Navigator.pushReplacementNamed(context,name).

Complete code sample

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: SO(),
    );
  }
}

class SO extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PageOne(),
    );
  }
}

class PageOne extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Page 1'),
      ),
      backgroundColor: Colors.amber,
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            RaisedButton(
              onPressed: () {
                print('creating replacement page 1');
                Navigator.pushReplacement(context, MaterialPageRoute(builder: (BuildContext context) {
                  return PageOne();
                }));
              },
              child: Text('Go to page 1'),
            ),
            RaisedButton(
              onPressed: () {
                print('creating new page 2');
                Navigator.push(context, MaterialPageRoute(builder: (BuildContext context) {
                  return PageTwo();
                }));
              },
              child: Text('Go to page 2'),
            ),
          ],
        ),
      ),
    );
  }
}

class PageTwo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Page 2'),
      ),
      backgroundColor: Colors.brown,
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            RaisedButton(
              onPressed: () {
                print('creating new page 1');
                Navigator.push(context, MaterialPageRoute(builder: (BuildContext context) => PageOne()));
              },
              child: Text('Go to page 1'),
            ),
            RaisedButton(
              onPressed: () {
                print('creating replacement page 2');
                Navigator.pushReplacement(context, MaterialPageRoute(builder: (BuildContext context) => PageTwo()));
              },
              child: Text('Go to page 2'),
            ),
          ],
        ),
      ),
    );
  }
}



回答2:


You should use Navigator.pushReplacement(). Here are the docs: https://api.flutter.dev/flutter/widgets/NavigatorState/pushReplacement.html

In summary, when you call pushReplacement, it pushes a new page but also disposes of the previous one. Now, when you press the back button, it should bring you back to page 1.



来源:https://stackoverflow.com/questions/59457306/flutter-navigation-reopen-page-instead-of-pushing-it-again

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!