flutter buttomNavigationBar 无法正常显示或工作

Question

我有以下代码：

  @override
  Widget build(BuildContext context) {
    // This method is rerun every time setState is called, for instance as done
    // by the _incrementCounter method above.
    //
    // The Flutter framework has been optimized to make rerunning build methods
    // fast, so that you can just rebuild anything that needs updating rather
    // than having to individually change instances of widgets.

    this.setTable();

    return Scaffold(
        appBar: AppBar(
          // Here we take the value from the MyHomePage object that was created by
          // the App.build method, and use it to set our appbar title.

          title: Row(children: <Widget>[
            Image.asset(
              'images/logobig.png',
              width: 40.0,
              height: 40.0,
            ),
            Text(widget.title),
          ]),
          backgroundColor: Colors.blue,
        ),
        body: SingleChildScrollView(
          scrollDirection: Axis.horizontal,
          child: SingleChildScrollView(
            scrollDirection: Axis.vertical,
            child: Column(children: <Widget>[
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  "Currency Exchange Rates",
                  textScaleFactor: 1,
                  style: TextStyle(fontWeight: FontWeight.bold),
                ),
              ),
              DataTable(
                // textDirection: TextDirection.rtl,
                // defaultVerticalAlignment: TableCellVerticalAlignment.bottom,
                // border:TableBorder.all(width: 2.0,color: Colors.red),
                showCheckboxColumn: false,
                columns: const <DataColumn>[
                  DataColumn(
                    label: Text(
                      'Symbol',
                      style: TextStyle(fontWeight: FontWeight.bold),
                    ),
                  ),
                  DataColumn(
                    label: Text(
                      'Buy',
                      style: TextStyle(fontWeight: FontWeight.bold),
                    ),
                  ),
                  DataColumn(
                    label: Text(
                      'Sell',
                      style: TextStyle(fontWeight: FontWeight.bold),
                    ),
                  ),
                ],
                rows: rows,
              ),
            ]),
          ),
        ),
        bottomNavigationBar: Material(
            color: Colors.white,
            child: Row(children: <Widget>[
              FlatButton(
                  onPressed: () => {},
                  color: Colors.white,
                  padding: EdgeInsets.all(10.0),
                  child: Column(
                    // Replace with a Row for horizontal icon + text
                    children: <Widget>[
                      ImageIcon(
                        AssetImage('images/dollar_world_grid_selected.png'),
                        size: 40.0,
                      ),
                      Text(
                        "Currency",
                        style:
                            TextStyle(color: Color.fromRGBO(43, 73, 193, 0.4)),
                      )
                    ],
                  )),
              FlatButton(
                  onPressed: () => {
                        Navigator.pushReplacement(
                            context,
                            new MaterialPageRoute(
                                builder: (context) => goldRate()))
                      },
                  color: Colors.white,
                  padding: EdgeInsets.all(10.0),
                  child: Column(
                    // Replace with a Row for horizontal icon + text
                    children: <Widget>[
                      ImageIcon(
                        AssetImage('images/gold-bars.png'),
                        size: 40.0,
                      ),
                      Text(
                        "Gold",
                        style: TextStyle(
                            color: Color.fromRGBO(127, 127, 127, 0.4)),
                      )
                    ],
                  )),
            ])));
  }

当用户单击其中一个按钮时，buttomNavigationBar 应该在不同的屏幕之间导航。不幸的是我得到以下输出：

如你所见，显示出来了。其他组件未显示且图标图像未出现。关于如何修复或以其他方式做到这一点的任何想法？谢谢

Answer 1

将 bottomNavigationBar 替换为 persistentFooterButtons:

persistentFooterButtons: <Widget>[
    new Container(
      height: 100,
      child: Row(
        children: <Widget>[
          FlatButton(
              onPressed: () => {},
              color: Colors.white,
              padding: EdgeInsets.all(10.0),
              child: Column(
                // Replace with a Row for horizontal icon + text
                children: <Widget>[
                  ImageIcon(
                    AssetImage('images/dollar_world_grid_selected.png'),
                    size: 40.0,
                  ),
                  Text(
                    "Currency",
                    style:
                        TextStyle(color: Color.fromRGBO(43, 73, 193, 0.4)),
                  )
                ],
              )),
          FlatButton(
            onPressed: () => {},
            color: Colors.white,
            padding: EdgeInsets.all(10.0),
            child: Column(
              // Replace with a Row for horizontal icon + text
              children: <Widget>[
                ImageIcon(
                  AssetImage('images/gold-bars.png'),
                  size: 40.0,
                ),
                Text(
                  "Gold",
                  style:
                      TextStyle(color: Color.fromRGBO(127, 127, 127, 0.4)),
                )
              ],
            ),
          ),
        ],
      ),
    ),
  ],

如果您想使用 BottomNavigationBar，请查看文档中的 example。

flutter buttomNavigationBar 无法正常显示或工作

flutter buttomNavigationBar not displaying or working correctly

navigation

button

flutter