Flutter showSearch keyboard search

Question

I am very new to Flutter and Dart so I am trying to build a simple search app with queries based on a word typed in Flutters showSearch search bar. I understand the listtile that is built to show suggestions to the user, and tapping that suggestion will activate the buildresults widget. However, I want to enable the search button on the keyboard to simply search the inputted word, rather than tapping on the limited suggestion list. Simple android keyboard

When the button is clicked normally, the keyboard is closed the buildresults is not activated. So far you have to actually click a suggested listtile option. Is there a way to enable the keyboard's search button to search the inputted text? or Is the user limited to the suggested listtile options? I will list my showSearch delegate below:

class StockDelegate extends SearchDelegate {
  final stocks = [
    "IBM",
    "NKLAW",
    "DKNGZ",
    "DRD",
    "PRTS",
    "TSLA",
    "KIRK",
    "VBIV"
  ];
  final suggested = ["IBM", "TSLA", "BNTX"];

  @override
  // TODO: implement textInputAction

  // TODO: implement textInputAction
  TextInputAction get textInputAction => super.textInputAction;

  @override
  List buildActions(BuildContext context) {
    //actions for app bar
    StockProvider _stockProvider =
        Provider.of(context, listen: true);
    return [
      IconButton(
          icon: Icon(Icons.clear),
          onPressed: () {
            query = '';
          }),
    ];
  }

  @override
  Widget buildLeading(BuildContext context) {
    //Leading icon on the left of the app bar
    return IconButton(
        icon: AnimatedIcon(
          icon: AnimatedIcons.menu_arrow,
          progress: transitionAnimation,
        ),
        onPressed: () {
          close(context, null);
        });
  }

  @override
  Widget buildResults(BuildContext context) {
    //build results code 
   
  }

  @override
  Widget buildSuggestions(BuildContext context) {
    // show when someone search for something
    stocks.insert(0, query.toString());

    final suggestionList = query.isEmpty
        ? suggested
        : stocks.where((p) => p.startsWith(query)).toList();

    return ListView.builder(
      itemCount: suggestionList.length,
      itemBuilder: (context, index) => ListTile(
        onTap: () async {
          Provider.of(context, listen: false)
              .searchBySymbol(suggestionList[index]);

          if (!stocks.contains(suggestionList[index]))
            suggestionList.add(suggestionList[index]);

          showResults(context);
        },
        leading: Icon(Icons.attach_money),
        title: Text(suggestionList[index]),
      ),
    );
  }

user_5362583 · Answer

I don't know whether you know about onSubmitted property or not, which is used in the TextField/Text/TextFormField. Since, I cannot see your TexFormField/Text/TextField anywhere, but I think you must be using it somewhere.

So, this is how onFieldSubmitted used, which does the job which you want, that is, when the user hit on the magnifying lens on the keypad, it runs your function

              TextFormField(
                controller: _yourTextEditingController,
                textInputAction: TextInputAction.search,
                onFieldSubmitted: (){
                     // here you do your operation when you hit the 
                     // keypad magnifying lens
                     // check with print()
                     print('Pressed via keypad');
                }
              )

Don't get confused with onSubmitted name, onFieldSubmitted is used in TextFormField/Text/TextField, which uses onSubmitted property. I hope that answers your question :) Let me know, is that was the thing you were looking for.

user_16495047 · Answer

Override showResults() method similar to buildSuggestions().

override showResults method as follow:

  @override
  void showResults(BuildContext context) {
    super.showResults(context);
    showSuggestions(context);
    FocusScope.of(context).unfocus();
  }

Flutter showSearch keyboard search

2 Answers