dart - 在Flutter中从底部导航栏执行整页路线

Question

我实现了一个底部导航栏，当单击图标时，将重建支架的主体。但是，当按下我的第三个图标(索引= 2)时，我需要一个完整的页面路线，因此也不会显示底部导航栏。我有一些有效的代码，但是没有一个后退按钮可以弹出堆栈(因为它没有被压入堆栈)。 如何仅对底部导航栏上的一个索引使用后退按钮进行全页导航？

码:

class MainApp extends StatefulWidget {

  @override
  _MainAppState createState() => _MainAppState();
}

class _MainAppState extends State<MainApp> {

  var _pages = [

    Page1(),
    Page2(),
    SpecialPage(),
    Page3(),
    Page4(),

  ];

  int _currentIndex = 0;

  onTabTapped(int index) {
    setState(() {
      _currentIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {


    return _currentIndex == 2 ?  SpecialPage(): Scaffold(
      body: _pages[_currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        items: [

          BottomNavigationBarItem(icon: Icon(Icons.library_books), title: Text('')),
          BottomNavigationBarItem(icon: Icon(Icons.notifications), title: Text('')),
          BottomNavigationBarItem(icon: Icon(Icons.add_circle_outline), title: Text('')),
          BottomNavigationBarItem(icon: Icon(Icons.mail), title: Text('')),
          BottomNavigationBarItem(icon: Icon(Icons.person), title: Text('')),

        ],
        onTap: onTabTapped,
        currentIndex: _currentIndex,
      ),
    );
  }
}

Answer 1

不要在 body 上使用bottomNavigationBar，而是使用Stack。

body: Stack(
  children: <Widget>[

      // whatever your main screen content is

      Positioned(
        bottom: 0.0,
        left: 0.0,
        right: 0.0,
        child: MyCustomNav(),
      ),

  ]
)

那么您就可以连续制作五个可以做您想做的项目。