dart - 如何在单击 BottomAppBar 图标时导航到新屏幕？

Question

我想在 BottomAppBar 的单击图标上导航到新屏幕，但出现错误：在初始化程序中只能访问静态成员

final makeBottom = Container(
height: 45.0,
child: BottomAppBar(
  color: Colors.white,
  child: Row(
    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
    children: <Widget>[
      IconButton(
        icon: Icon(Icons.home, color: Color.fromARGB(255, 30, 110, 160)),
        onPressed: navigateToPage,//only static members can be accessed in initializers
      ),
      IconButton(
        icon: Icon(Icons.search, color: Color.fromARGB(255, 30, 110, 160)),
        onPressed: () {},
      ),
      IconButton(
        icon: Icon(Icons.star, color: Color.fromARGB(255, 30, 110, 160)),
        onPressed: () {},
      ),
      IconButton(
        icon: Icon(Icons.favorite_border,
            color: Color.fromARGB(255, 30, 110, 160)),
        onPressed: () {},
      ),
      IconButton(
        icon: Icon(Icons.account_circle,
            color: Color.fromARGB(255, 30, 110, 160)),
        onPressed: () {},
      ),
    ],
  ),
),

);

方法 navigateToPage

 void navigateToPage() async {
Navigator.push(
    context,
    MaterialPageRoute(
        builder: (context) => Userqst(
              user: widget.user,
            ),
        fullscreenDialog: true));

}

Answer 1

试试下面的代码..

return Scaffold{
bottomNavigationBar : bottomNav()  // call the Widget
}

Widget bottomNav(){
return new Container (
height :45.0,
//Copy the bottomAppBar code
);
}

Answer 2

下面的代码可以帮助你 -

 class Home extends StatefulWidget {
      @override
      State<StatefulWidget> createState() {
        return _HomeState();
      }
    }

    class _HomeState extends State<Home> {
      int _currentIndex = 0;
      final List<Widget> _children = [
        HomeListView(),
        MyGridView()
      ];
      var _title = 'Home';

      @override
      Widget build(BuildContext context) {

       return Scaffold(
          appBar: AppBar(
            backgroundColor: Color.fromRGBO(41, 167, 77, 50),
            title: Text(_title, textAlign: TextAlign.center),
          ),
          body: _children[_currentIndex],
          bottomNavigationBar: BottomNavigationBar(

            onTap: onTabTapped,
            selectedItemColor: Color.fromRGBO(33, 137, 38, 60),
            type: BottomNavigationBarType.fixed,
            backgroundColor: Color.fromRGBO(252, 207, 3, 60),
            currentIndex: _currentIndex,
            // this will be set when a new tab is tapped
            items: [
              BottomNavigationBarItem(
                icon: new Icon(Icons.home),
                title: new Text('Home'),
              ),
              BottomNavigationBarItem(
                icon: new Icon(Icons.mail),
                title: new Text('My Venue'),
              )
                ],
          ),
        );
      }

      void onTabTapped(int index) {
        setState(() {
          _currentIndex = index;
          switch (index) {
            case 0:
              _title = 'Home';
              break;
            case 1:
              _title = 'My Venue';
              break;

          }
        });
      }
    }

Answer 3

问题可能是你的方法无法获取上下文所以在你的 Iconbutton 传递上下文是这样的

IconButton(
        icon: Icon(Icons.home, color: Color.fromARGB(255, 30, 110, 160)),
        onPressed: (){navigateToPage(context);},//only static members can be accessed in initializers
      ),

并尝试像这样修改方法

 void navigateToPage(BuildContext context) async {
Navigator.push(
    context,
    MaterialPageRoute(
        builder: (context) => Userqst(
              user: widget.user,
            ),
        fullscreenDialog: true));
}

Answer 4

我认为您正在尝试从“Widget build(BuildContext context)”上下文中构建该 Widget，这就是您遇到此问题的原因。

我为此考虑了2个解决方案。

首先，您将代码放入主函数“Widget build(BuildContext context)”中，然后在任何您想调用的地方调用 Widget。

@override
Widget build(BuildContext context){
  //here you put your "final makeBottom" code;
  return Scaffold(//and somewhere around there you place your "makeBottom" Widget);
}

其次，将您的整个代码包装为一个函数，该函数将返回该 Container()，然后将其调用到“构建”函数中。

Widget makeBottom(BuildContext context){
  return //your Container();
}