3

enter image description here

if I long press on an item of my bottom navigation bar item, then it will show a popup / toast with the title of its item ( that inbox popup on the image above). I want to disable that behavior, how to do that?

this is my current bottom nav bar

BottomNavigationBar(
        onTap: _selectPage,
        elevation: 2,
        backgroundColor: const Color.fromRGBO(245, 245, 245, 1),
        unselectedItemColor: Colors.grey,
        selectedItemColor: Theme.of(context).primaryColor,
        currentIndex: _selectedPageIndex,
        showSelectedLabels: false,
        showUnselectedLabels: false,
        type: BottomNavigationBarType.fixed,
        items: [
          BottomNavigationBarItem(
            icon: Icon(Icons.home_outlined),
            label: "Home",
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.search),
            label: "Search",
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.add_circle_outline),
            label: "create",
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.notifications_none),
            label: "Inbox",
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.person_outline),
            label: "Profile",
          ),
        ],
      ),
Alexa289
  • 8,089
  • 10
  • 74
  • 178

2 Answers2

9

Just pass an empty string to tooltip and it should stop displaying the popup. Here is your updated code:

BottomNavigationBar(
  onTap: _selectPage,
  elevation: 2,
  backgroundColor: const Color.fromRGBO(245, 245, 245, 1),
  unselectedItemColor: Colors.grey,
  selectedItemColor: Theme.of(context).primaryColor,
  currentIndex: _selectedPageIndex,
  showSelectedLabels: false,
  showUnselectedLabels: false,
  type: BottomNavigationBarType.fixed,
  items: [
    BottomNavigationBarItem(
      icon: Icon(Icons.home_outlined),
      label: "Home",
      tooltip: '',
    ),
    BottomNavigationBarItem(
      icon: Icon(Icons.search),
      label: "Search",
      tooltip: '',
    ),
    BottomNavigationBarItem(
      icon: Icon(Icons.add_circle_outline),
      label: "create",
      tooltip: '',
    ),
    BottomNavigationBarItem(
      icon: Icon(Icons.notifications_none),
      label: "Inbox",
      tooltip: '',
    ),
    BottomNavigationBarItem(
      icon: Icon(Icons.person_outline),
      label: "Profile",
      tooltip: '',
    ),
  ],
),

This was raised as an issue on github a few months ago, refer https://github.com/flutter/flutter/issues/71049#:~:text=BottomNavigationBar%20has%20no%20API%20for,to%20completely%20disable%20its%20tooltips.

Zac
  • 998
  • 6
  • 19
0

Instead of setting an empty string to tooltip, an alternative is to use CupertinoTabBar

Inspired by

https://github.com/roughike/inKino/blob/development/mobile/lib/ui/inkino_bottom_bar.dart

P.S Flutter team has TooltipWidget coming out soon https://github.com/flutter/flutter/pull/91609

Zoe
  • 27,060
  • 21
  • 118
  • 148
Dmitry Grin
  • 61
  • 1
  • 7
  • 2
    Please don't roll back edits just because they remove fluff; [these types of edits are allowed](https://meta.stackoverflow.com/q/260776/6296561). – Zoe Nov 14 '21 at 18:11