I currently have an application that contains a bottom tab navigation of which I want for the user to be able to navigate whatever page was tapped. I'm currently working with the search page where the user is able to go in and click on the search field of which it the takes them to a drawer where they are able to enter their search input via the showSearch() method which gets passed into the onTap callback on my TextField Widget.

In addition to having the option of clicking on the text field itself, I also want this showSearch() drawer to appear as a default when the user clicks on the search icon that is located on the Bottom Tab Navigation. The problem is that the BottomNavigationBarItem Widget doesn't accept any callback functions as an argument.

Moving forward, I plan to reconfigure my BottomNavigationBar to accept IconButton Widgets which do accept callback functions.

My question is, how do I make it so that I'm able to pass a showSearch() method into the actual Search Icon located in my Bottom Tab Navigation so that it does the same as my search bar?

Bottom Tab Navigation Widget

 class BottomTabNavigation extends StatefulWidget {
  @override
  _BottomTabNavigationState createState() => _BottomTabNavigationState();
}

class _BottomTabNavigationState extends State<BottomTabNavigation> {
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
  int _selectedIndex = 0;
  final List<Widget> _children = [
    PracticionerMainView(),
    PracticionerSearchView(),
    PracticionerProfileView(),
  ];

  void _onTappedHandler(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldKey,
      appBar: HealthHubAppBar(
        scaffoldKey: _scaffoldKey,
      ),
      drawer: HealthHubDrawer(),
      body: _children[_selectedIndex],
      bottomNavigationBar: BottomNavigationBar(
        onTap: _onTappedHandler,
        currentIndex: _selectedIndex,
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: Text('User'),
          ),
          BottomNavigationBarItem(            
            icon: Icon(Icons.search),                       
            title: Text('Search'),
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.person_outline),
            title: Text('My Appointments'),
          ),
        ],
        selectedItemColor: Colors.blue[200],
      ),
    );
  }
}

Search View Widget

 class SearchFieldDelegation extends SearchDelegate {
  @override
  List<Widget> buildActions(BuildContext context) {
    return [
      IconButton(
        icon: Icon(Icons.clear),
        onPressed: () {
          query = '';
        },
      ),
    ];
  }

  @override
  Widget buildLeading(BuildContext context) {
    return IconButton(
      icon: Icon(Icons.arrow_back),
      onPressed: () {
        close(context, null);
      },
    );
  }

  @override
  Widget buildResults(BuildContext context) {
    return Column();
  }

  @override
  Widget buildSuggestions(BuildContext context) {
    return Column();
  }

}

    class PracticionerSearchView extends StatefulWidget {

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

class _PracticionerSearchViewState extends State<PracticionerSearchView> {
  TextEditingController _handleSearchEdit = TextEditingController();
  String searchEntry;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Expanded(
          child: ListView(
            children: <Widget>[
              Center(
                child: Container(
                  padding: EdgeInsets.all(25.0),
                  child: TextField(
                    onTap: () {
                      showSearch(
                        context: context,
                        delegate: SearchFieldDelegation(),
                      );
                    },
                    decoration: InputDecoration(
                      labelText: 'Search',
                      hintText: 'Search Practitioners',
                      prefixIcon: Icon(Icons.search),
                      border: OutlineInputBorder(
                        borderRadius: BorderRadius.all(
                          Radius.circular(25.0),
                        ),
                      ),
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
      ],
    ),
  },
},


Solution 1: Selim Kundakçıoğlu

I guess you can do it in your _onTapHandler method like.

void _onTapHandler(int index) {
  // assuming index 1 is your search tab
  if(index == 1) {
    showSearch(
      context: context,
      delegate: SearchFieldDelegation(),
    );
  } else {
    setState(() {
      _selectedIndex = index;
    });
  }
}