如何使用相同的导航栏但不同的页面/ FAB

Question

我的应用程序中有多个页面，但每个页面都有自己的浮动操作按钮，具有不同的功能（与页面本身相关联），每个页面本质上都是一个脚手架，我想要的是在所有页面中使用相同的底部导航栏但是只有脚手架的身体和FAB改变。

Answer 1

你的问题本身有一个答案，但仍然是你可以尝试的方式

在pubsec.yaml中

  bmnav: ^0.3.4

您可以像这样使用底栏导航

class BottomBarActivityState extends State<BottomBarActivity> {
  //different screens on selection of tabs
  final List<Widget> screens = [
    screen1(),
    screen2(),
    screen3(),
   ];
  Widget currentScreen = screen1();
  int currentTab = 0;
  final PageStorageBucket bucket = PageStorageBucket();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PageStorage(child: currentScreen, bucket: bucket),
      bottomNavigationBar: bmnav.BottomNav(
        index: currentTab,
        items: [
          bmnav.BottomNavItem(Icons.home),
          bmnav.BottomNavItem(Icons.home),
          bmnav.BottomNavItem(Icons.home),
        ],
        onTap: (i) {
          setState(() {
            currentTab = i;
            currentScreen = screens[i];
          });
        },
      ),
    );
  }
}

Edit

屏幕截图1

class screen1 extends StatefulWidget {
  @override
  screen1State createState() {
    return new screen1State();
  }
}

class screen1State extends State<screen1> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("screen1"),
      ),
      body: FloatingActionButton(
        backgroundColor: Colors.blue,
        onPressed: _onPressd,
        child: Icon(Icons.add),
      ),
    );
  }

  void _onPressd() {}
}

屏幕2

class screen2 extends StatefulWidget {
  @override
  screen1State createState() {
    return new screen2State();
  }
}

class screen2State extends State<screen2> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("screen1"),
      ),
      body: FloatingActionButton(
        backgroundColor: Colors.blue,
        onPressed: _onPressd,
        child: Icon(Icons.add),
      ),
    );
  }

  void _onPressd() {}
}

Answer 2

int _currentIndex = 0;

enter code body

body:
  pages(_currentIndex),
  bottomNavigationBar: BottomNavigationBar(
    onTap: onTabTapped,
    currentIndex: _currentIndex,
    items: [
     //Enter your Menu list here
    ],
  ),

code page

pages(int currentPosition) {
switch (currentPosition) {
  case 0:
    return new pagehome();
  case 1:
    return new pagesongs();
  ...
  default:
    return new Text("Error");
 }
}

click event

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