How to trigger by a /

[lucasjinreal]

How to manually trigger search only by frist typing /, otherwise it can be used as normal text field?

[maheshj01]

Hello @lucasjinreal, Thanks for filing the issue. SearchField allows you to show suggestions based on custom logic using onSearchTextChanged callback. This callback is triggered everytime the text in searchfield changes. This callback expects you to return the filtered suggestions

I think you should be able to achieve it by doing something like this,

onSearchTextChanged: (query) {
      List<String> filter = [];
      if (query.startsWith('/')) {
        filter = suggestions;
      }
      return filter
          .map((e) => SearchFieldListItem<String>(e,
              child: Padding(
                padding: const EdgeInsets.symmetric(vertical: 4.0),
                child: Text(e,
                    style: TextStyle(fontSize: 24, color: Colors.red)),
              )))
          .toList();
          

Let me know if that doesn't work.

[maheshj01]

You may also refer this complete code sample in the example app.

[lucasjinreal]

@maheshmnj thanks for your kindly demo.

the onSearchTextChanged's params query would be always whole text users input right? I want the pop window suggest only when first / pressed, if later more / typed, it will be ignored, will it handle this ?

if i want / triggered, and don't want it always trigger, I have to swipe the / when the suggested item clicked?

[maheshj01]

the onSearchTextChanged's params query would be always whole text users input right? I want the pop window suggest only when first / pressed, if later more / typed, it will be ignored, will it handle this ?

@lucasjinreal Yes, the query parameter gives the entire text present in the searchfield. That callback is invoked everytime the text input changes in the searchfield meaning if a user types / or // it will be triggered with respective text in the searchfield.

If you want to show suggestions only when text input has first / then you could write your own logic or also use regular expression. The callback only expects you to return a list (an empty list would mean no suggestions)

[lucasjinreal]

@maheshmnj the query of this should be from textController right? So if i want it only detects / at first input, it should clear textController input right? which means, my ExtendedTextField (it shows span for certain text pattern) should not using span pattern start with /

[maheshj01]

the query of this should be from textController right? So if i want it only detects / at first input, it should clear textController input right?

I am just leveraging the onChanged property of the Flutter's TextField to get the query, But if you want more control on the searchfield input you can definetly use a TextEditingController and pass it to Searchfield.

https://github.com/maheshmnj/searchfield/blob/57e21c82ba24e1c7eb70fc105bba64306513abed/lib/src/searchfield.dart#L670-L675

Regarding positioning the suggestions on top of searchfield use the offset property

offset: Offset(0, -250),

[lucasjinreal]

@maheshmnj Hello, I have a customized TextField , how to using along with my customized TextField,
And seems it can not controlled by arrowUp key on Desktop.
I want using arrowUp key to select suggestions on Desktop.

[maheshj01]

@lucasjinreal At this point It is not possible to use your own textfield to get the searchfield features and there are no plans to do so in the future. May I know what customization you are referring to that is in Textfield but not in searchfield?

I want using arrowUp key to select suggestions on Desktop.

This is being tracked here #7

[maheshj01]

@lucasjinreal Keyboard support has been added to Searchfield, Now you should be able to navigate suggestions using the arrow keys, Please use the latest version 0.9.9

[maheshj01]

How to manually trigger search only by first typing /, otherwise it can be used as a normal text field.

@lucasjinreal I filed an issue to track trigger-based search where the search suggestion will be shown only when you enter a specific pattern. Please follow up on this issue #116