Agung
Agung

Reputation: 13803

how to disable a pop up / toast after long press on bottom navigation bar item in Flutter?

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",
          ),
        ],
      ),
    

Upvotes: 3

Views: 1874

Answers (2)

Dmitry Grin
Dmitry Grin

Reputation: 141

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

Upvotes: 0

Zac
Zac

Reputation: 1103

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.

Upvotes: 10

Related Questions