How can i hide my bottom nav bar on button pressed, flutter?

I have a widget CustomerView widget that holds a bottomNavigationBar button, when this button is clicked i want to hide my bottom navigation bar and when the button is clicked again, i want to show the bottom navigation bar.

This is how the UI looks with the button and my bottom nav bar:

Here is the controller for the Navigation bar:

class RootController extends GetxController {
  final currentIndex = 0.obs;
  final notificationsCount = 0.obs;
  final customPages = <CustomPage>[].obs;
  NotificationRepository _notificationRepository;
  CustomPageRepository _customPageRepository;
  RootController() {
    _notificationRepository = new NotificationRepository();
    _customPageRepository = new CustomPageRepository();
  }

  @override
  void onInit() async {
    await getCustomPages();
    if (Get.arguments != null && Get.arguments is int) {
      changePageInRoot(Get.arguments as int);
    } else {
      changePageInRoot(0);
    }
    super.onInit();
  }

  List<Widget> pages = [
    HomeView(),
    JobsView(),
    CustomersView(),
    MessagesView(),
    AccountView(),
  ];

  Widget get currentPage => pages[currentIndex.value];

  /**
   * change page in route
   * */
  void changePageInRoot(int _index) {
    currentIndex.value = _index;
  }
  
  void changePageOutRoot(int _index) {
    currentIndex.value = _index;
    Get.offNamedUntil(Routes.ROOT, (Route route) {
      if (route.settings.name == Routes.ROOT) {
        return true;
      }
      return false;
    }, arguments: _index);
  }

  Future<void> changePage(int _index) async {
    if (Get.currentRoute == Routes.ROOT) {
      changePageInRoot(_index);
    } else {
      changePageOutRoot(_index);
    }
    await refreshPage(_index);
  }

  Future<void> refreshPage(int _index) async {
    switch (_index) {
      case 0:
        {
          await Get.find<HomeController>().refreshHome();
          break;
        }
      case 2:
        {
          await Get.find<MessagesController>().refreshMessages();
          break;
        }
    }
  }

  void getNotificationsCount() async {
    notificationsCount.value = await _notificationRepository.getCount();
  }

  Future<void> getCustomPages() async {
    customPages.assignAll(await _customPageRepository.all());
  }
}

This is the View code for the Navigation Bar:

class RootView extends GetView<RootController> {
  @override
  Widget build(BuildContext context) {

    return Obx(() {
      return Scaffold(
        drawer: MainDrawerWidget(),
        
        body: controller.currentPage,
        bottomNavigationBar: CustomBottomNavigationBar(
          
          backgroundColor: Color(0xffFFFFFF),
          itemColor: Color(0xffB0BEC1),
          currentIndex: controller.currentIndex.value,
          onChange: (index) {
            controller.changePage(index);
          },
          children: [
            CustomBottomNavigationItem(
              icon: Icons.home_filled,
              label: "Home".tr,
            ),
            CustomBottomNavigationItem(
              icon: Icons.book_outlined,
              label: "Jobs".tr,
            ),
            
            CustomBottomNavigationItem(
              
              icon: Icons.people_outlined,
              label: "Customers".tr,
            ),
            CustomBottomNavigationItem(
              icon: Icons.chat_outlined,
              label: "Messages".tr,
            ),
            CustomBottomNavigationItem(
              icon: Icons.person_outline_rounded,
              label: "Account".tr,
            ),
          ],
        ),
      );
    });
  }
}

And this is the CustomBottomNavigationBar widget itself

const Color PRIMARY_COLOR = Colors.blueAccent;
const Color BACKGROUND_COLOR = Color(0xffE2E7F2);

class CustomBottomNavigationBar extends StatefulWidget {
  final Color backgroundColor;
  final Color itemColor;
  final List<CustomBottomNavigationItem> children;
  final Function(int) onChange;
  final int currentIndex;

  CustomBottomNavigationBar(
      {this.backgroundColor = BACKGROUND_COLOR,
      this.itemColor = PRIMARY_COLOR,
      this.currentIndex = 0,
      @required this.children,
      this.onChange});

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

class _CustomBottomNavigationBarState extends State<CustomBottomNavigationBar> {
  
  void _changeIndex(int index) {
    if (widget.onChange != null) {
      widget.onChange(index);
    }
  }

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(15.0),
      height: MediaQuery.of(context).size.height * 0.11,
      color: widget.backgroundColor,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: widget.children.map((item) {
          var icon = item.icon;
          var label = item.label;
          int index = widget.children.indexOf(item);
          return GestureDetector(
            onTap: () {
              _changeIndex(index);
            },
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: <Widget>[
                Icon(
                  icon,
                  size: 24,
                  color: widget.currentIndex == index
                      ? Color(0xff34495E)
                      : Color(0xff7F8D90),
                ),
                Expanded(
                  flex: 2,
                  child: Text(
                    label ?? '',
                    // overflow: TextOverflow.ellipsis,
                    textAlign: TextAlign.justify,
                    style: TextStyle(
                        fontSize: MediaQuery.of(context).size.width * 0.03,
                        color: widget.currentIndex == index
                            ? Color(0xff34495E)
                            : Color(0xff7F8D90)),
                  ),
                )
              ],
            ),
          );
        }).toList(),
      ),
    );
  }
}

class CustomBottomNavigationItem {
  final IconData icon;
  final String label;
  final Color color;

  CustomBottomNavigationItem(
      {@required this.icon, @required this.label, this.color});
}

How do i achieve this?

I have tried checking articles on here, but all of them seem to only tell me how to hide bottom navigation bar on scroll.

Thank you!