alnitak / flutter_star_menu

Flutter contextual popup menu with different shapes and multiple ways to fine-tune animation and position
MIT License
51 stars 18 forks source link

How is it possible to make it work with a BottomNavigationBar ? #15

Closed baptistemchl closed 1 year ago

baptistemchl commented 1 year ago

Hello,

I would like to use this lib with my BottomNavigationBar.

@override
Widget build(BuildContext context) {
  return BottomNavigationBar(
    selectedItemColor: ColorResources.blue,
    unselectedItemColor: ColorResources.black,
    showUnselectedLabels: true,
    items: <BottomNavigationBarItem>[
      BottomNavigationBarItem(
        icon: SvgPicture.asset(
          "assets/menu_icon/ICON_accueil.svg",
        ),
        activeIcon: SvgPicture.asset("assets/menu_icon/ICON_accueil.svg",
            color: ColorResources.blue),
        label: "Fil d'actu",
      ),
      BottomNavigationBarItem(
        icon: SvgPicture.asset("assets/menu_icon/Idees_votez.svg"),
        activeIcon: SvgPicture.asset("assets/menu_icon/Idees_votez.svg",
            color: ColorResources.blue),
        label: 'Idées',
      ),
      BottomNavigationBarItem(
        icon: SvgPicture.asset("assets/menu_icon/Entraide.svg"),
        activeIcon: SvgPicture.asset("assets/menu_icon/Entraide.svg",
            color: ColorResources.blue),
        label: 'Entraide',
      ),
      BottomNavigationBarItem(
        icon: SvgPicture.asset("assets/menu_icon/Projet.svg"),
        activeIcon: SvgPicture.asset("assets/menu_icon/Projet.svg",
            color: ColorResources.blue),
        label: 'Projets',
      ),
      const BottomNavigationBarItem(
        icon: Icon(Icons.menu),
        activeIcon: Icon(Icons.menu, color: ColorResources.blue),
        label: 'Autres',
      ),
    ],
    currentIndex: _selectedIndex,
    onTap: showThat,
  );
}

The goal is to show the chipsEntries when i tap on the "Autres" Icon.

How can i do that ?

Thanks !

alnitak commented 1 year ago

Hi,

since BottomNavigationBar items are not Widgets, you can add a StarMenu to icon or activeIcon of the BottomNavigationBarItem like this:

    BottomNavigationBarItem(
          icon: Icon(Icons.menu)
            .addStarMenu(
                items: items,
                params: StarMenuParameters(),
                onItemTapped: (index, controller) {},
             ),
          activeIcon: Icon(Icons.menu, color: ColorResources.blue),
          label: 'Autres',
     ),