如何通过单击BottomAppBar图标导航到新屏幕?

时间:2019-05-07 21:01:19

标签: dart flutter bottomappbar

我想导航至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: () {},
      ),
    ],
  ),
),

);

方法NavigationToPage

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

}

4 个答案:

答案 0 :(得分:0)

请尝试以下代码。

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

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

答案 1 :(得分:0)

问题可能是您的方法无法获取上下文 所以在您的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));
}

答案 2 :(得分:0)

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

我为此想到了两种解决方案。

首先,将代码放入主函数“ 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(),然后将其调用到“ build”函数中。

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

答案 3 :(得分:0)

下面的代码可能会帮助您-

 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;

          }
        });
      }
    }