Search code examples
flutterflutter-layoutfloating-action-button

How to modify parent FloatingActionButton on flutter?


I am making an app in which I have to pages, routed by a BottomNavigationBar, and each page has its own nested routes. The app contains a main FloatingActionButton centered and docked into the BottomNavigationBar. The problem is that I wanted to control what the FAB does from inside each nested route. The problem is that if I create a FAB inside each nested route the button will not be docked into the BottomNavigationBar. Bellow are some pictures. Anyone can help? Thanks in advance.

What I have :

enter image description here

What I wanted :

enter image description here


Solution

  • Is this what you are asking? If not please share some code which casing the problem

    UPDATE

     Scaffold(
          appBar: AppBar(
            title: Text('Test'),
          ),
          body: _screenList[_screenIndex],
          bottomNavigationBar: BottomNavigationBar(
              type: BottomNavigationBarType.fixed,
              currentIndex: _screenIndex,
              onTap: (index) {
                print(index);
                setState(() {
                  _screenIndex = index;
                });
              },
              items: [
                BottomNavigationBarItem(
                  icon: Icon(Icons.inbox),
                  title: Text('Screen1'),
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.search),
                  title: Text('Screen2'),
                ),
              ]),
          floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
          floatingActionButton: FloatingActionButton(
            child: Icon(
              Icons.android,
            ),
            onPressed: () {
              _screenIndex == 0
                  ? print('hello from screen1')
                  : print('hello from screen2');
            },
          ),
        );
    

    OUTPUT

    enter image description here