【问题标题】:Flutter Drawer navigate to a single page multiple timesFlutter Drawer 多次导航到单个页面
【发布时间】:2019-03-11 15:20:38
【问题描述】:

当我拉动抽屉并选择要导航到的页面时,就像创建一个新实例一样,例如,如果我在同一页面上单击 4 次,它会显示打开新页面 4 次的动画,当我按下手机的返回键。

  new ListTile(
        leading: Icon(Icons.home),
        title: new Text("Home"),
        onTap: () {
          Navigator.pop(ctxt);
          Navigator.push(
              ctxt, new MaterialPageRoute(builder: (ctxt) => MyHomePage()));
        },

这是我在所有页面中使用的抽屉文件

class DrawerOnly extends StatelessWidget {
  @override
  Widget build(BuildContext ctxt) {
    return new Drawer(
      child: new ListView(
        children: <Widget>[
          new UserAccountsDrawerHeader(
            accountName: new Text('Fethi'),
            accountEmail: new Text('Myemail@Mail.com'),
            currentAccountPicture: new CircleAvatar(
              backgroundImage: new NetworkImage('http://i.pravatar.cc/300'),
          ),
        ),
      new ListTile(
        leading: Icon(Icons.home),
        title: new Text("Home"),
        onTap: () {
          Navigator.pushReplacement(
              ctxt, new MaterialPageRoute(builder: (ctxt) => MyHomePage()));
        },
      ),
      new ListTile(
        leading: Icon(Icons.note),
        title: new Text("ADD Notes"),
        onTap: () {
          Navigator.pushReplacement(
              ctxt, new MaterialPageRoute(builder: (ctxt) => EditNote()));
        },
      ),
    ],
  ),
);

} }

【问题讨论】:

  • 请出示您的完整代码
  • 它太长了,这是导致问题的部分。

标签: flutter flutter-layout


【解决方案1】:

只需将Navigator.push 替换为Navigator.pushReplacement 并删除Navigator.pop

它将用新屏幕替换当前屏幕。它会解决你的问题。

要了解详细信息,请查看以下文档: https://docs.flutter.io/flutter/widgets/Navigator/pushReplacement.html

【讨论】:

  • 现在当我在主页进行更改并转到第二页然后返回主页时,这些更改没有保存,就像我第一次打开页面一样。
  • 和数据库有关系吗?
  • 是的,它将用您申请的新页面替换当前页面。并且它与数据库没有关系。
  • 那么我怎样才能在不丢失数据的情况下回到旧页面呢?
【解决方案2】:

根据您的代码,您正在初始化当前屏幕顶部的MyHomePage 屏幕(开始新屏幕)。在抽屉式导航中,您必须将 body: 替换为您希望显示的屏幕。

例子:

取一个变量

  int selectionScreen = 0;

您可以根据需要服用,我服用了int。现在基于此您可以选择要显示的屏幕。

new Scaffold(
        appBar: new AppBar(
          // here we display the title corresponding to the fragment
          // you can instead choose to have a static title
          title: new Text("Drawer navigation"),
        ),
        drawer: new Drawer(
          child: new Column(
            children: <Widget>[
              new ListTile(
                  leading: Icon(Icons.home),
                  title: new Text("Home"),
                  onTap: () {
                    setState(() {
                      selectionScreen = 0;
                    });
                    Navigator.pop(context);
                  })
            ],
          ),
        ),
        body: _getScreen(selectionScreen));

现在您可以使用_getScreen() 获得多个屏幕,因为您将更多ListTile 添加到抽屉列表中。

_getScreen(int selection) {
    switch (selection) {
      case 0:
        return MyHomePage();

      case 1:
        return Screen2();
      default:
    }
  }

这将替换现有抽屉导航屏幕中的屏幕。

请确认这是否是您所面临的问题。谢谢。

【讨论】:

  • 是的,我解决了这个问题,它现在正在替换页面,但是当我在主页进行更改并转到第二页然后返回主页时,更改没有保存,就像我是第一次打开这个页面。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-09-02
  • 2018-11-07
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多