Question

我到处搜索，找不到答案。

我有一个BottomNavigationBar和一个FloatingActionButton。

我要做的是当用户按下FloatingActionButton时推动全屏页面。

此页面需要覆盖BottomNavigationBar和上一个AppBar的区域，因为在此新页面中，不允许用户进入BottomNavigationBar的其他标签。

我遇到了fullscreenDialog，它是PageRoute窗口小部件类的一个属性，很兴奋，但无法使其按我想要的方式正常工作（顶部<->底部，我将在后面解释）

此页面将拥有自己的Scaffold和AppBar，并且能够推送/弹出到下一个屏幕（在其自己的导航树内部）

为了弹出此页面，用户将按下位于页面底部中心的“ x”按钮。

我想从顶部<->底部推送/弹出此新页面，而不是向左<->向右（适用于iOS / Cupertino）

我熟悉iOS设备上的此类UI（ModalViewController）

那么我们将如何实现push和pop命令？

还是有另一种更好/推荐的方式来做到这一点？

Answer 1

我遇到了类似的问题，并通过以下方法解决了该问题：

await Navigator.of(context, rootNavigator:true).push( // ensures fullscreen
      CupertinoPageRoute(
            builder: (BuildContext context) {
              return MyWidget();
            }
      ) );

位于https://stackoverflow.com/a/54017488/247451

Answer 2

您应该使用MaterialPageRoute道具(docs)来尝试fullscreenDialog：

Navigator.of(context).push(new MaterialPageRoute<Null>(
  builder: (BuildContext context) {
    return new AddEntryDialog();
  },
  fullscreenDialog: true
));

在您的情况下，可能不是最好的方法，但是它将显示在底部栏和任何其他导航小部件上方。

代码取自：https://marcinszalek.pl/flutter/flutter-fullscreendialog-tutorial-weighttracker-ii/

如何推送位于Flutter BottomNavigationBar顶部的全屏页面

2 个答案: