Code Monkey home page Code Monkey logo

flutter-autocomplete-textfield's Introduction

autocomplete_textfield

An autocomplete textfield for flutter

pull requests

Feel free to submit pull requests for desired changes / features / bug fixes... It makes the maintenance of this code much easier as I no longer use Flutter frequently.

Pub Package Can Be Found At

Pub Package

Breaking Changes

TextField is set by default to call onSubmitted on a suggestion tap and also to clear the TextField on submit.

These can both be disabled with submitOnSuggestionTap and clearOnSubmit respectively.

Usage

AutoCompleteTextField supports any data type suggestions

new AutoCompleteTextField<YOURDATATYPE>()

The suggestions parameter must have data that matches <YOURDATATYPE>

A global key of type GlobalKey<AutoCompleteTextFieldState<T>> is required so that the clear() method can be called to clear AutoCompleteTextField.

Strings and itemFilter

Filtering is case sensitive so when using strings a common implementation of itemFilter is .

itemFilter: (item, query) {
  return item.toLowerCase().startsWith(query.toLowerCase());
}

flutter-autocomplete-textfield's People

Contributors

ainiuso avatar altherat avatar baylessj avatar breitembach avatar dsolonenko avatar easazade avatar felixmccuaig avatar htmhell avatar j-j-gajjar avatar khamasaki avatar lsudyetd3353 avatar msalinas1088 avatar omar-alshyokh avatar pboussekey avatar spidgorny avatar sprechen avatar vleeuwenmenno avatar yakir8 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

flutter-autocomplete-textfield's Issues

How to use updateSuggestions? Example please

Basically I have wrapped the AutoCompleteTextField to add more functionality, but I have no idea how to update the suggestions in this new statefulWidget, When I tried in didUpdateWidget, i get an error

Can't access onTap method like TextField

Awesome plugin! Thanks
How can I access the onTap method like it is used in Text Field? Is it possible?

I want to list some suggestions if the user taps the autocomplete search field.

Not found error when compiling

Error: Type 'TextInputAction' not found.

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel beta, v0.5.1, on Mac OS X 10.13.4 17E199, locale en-US)
[✓] Android toolchain - develop for Android devices (Android SDK 28.0.1)
[✓] iOS toolchain - develop for iOS devices (Xcode 9.4.1)
[✓] Android Studio (version 3.1)
[✓] Connected devices (1 available)

getTextBeforeCursor on inactive InputConnection When click the suggestion list

here my code

child: Column(
            children: <Widget>[
              new SimpleAutoCompleteTextField(
                key: key,
                 suggestions: names,
                  decoration: const InputDecoration(
                      hintText: "Product Name",
                      labelText:"Product Name"
                ),  
                 textChanged: (text) => (){
                   textCurrent = text;
                   print("text name 1 "+text);
                 },
                  
                textSubmitted: (input) => (){
             
                  print("text name "+input);
                },
                clearOnSubmit: true,
                submitOnSuggestionTap: true,
                
              ),
              TextFormField(
                  decoration: const InputDecoration(
                       hintText: "Qty",
                       labelText:"Qty"
                     ),
              ),
              Container(
                  child: RaisedButton(
                    child: new Text(
                         'Save',
                         style: new TextStyle(
                           color: Colors.white
                         ),
                       ),
                    onPressed: (){
                      
                    },
                  ),
              ),
            ],
          )

when click the suggestion list, the text doesn't appear this method textSubmitted: (input)

here the log

W/IInputConnectionWrapper( 9092): getTextAfterCursor on inactive InputConnection
W/IInputConnectionWrapper( 9092): getCursorCapsMode on inactive InputConnection
W/IInputConnectionWrapper( 9092): getTextBeforeCursor on inactive InputConnection
W/IInputConnectionWrapper( 9092): getSelectedText on inactive InputConnection

Any suggestion?

overlay not collapsing upon selection after updateSuggestions

Hi,

I'm using AutoCompleteTextField in a StatefulWidget and have defined a function to initialize it like this:

_buildTextField() { textField = new AutoCompleteTextField<Product>( decoration: new InputDecoration( labelText: "Produkt", hintText: "Produkt suchen", suffixIcon: new IconButton( icon: new Icon(Icons.add), onPressed: () async { await Navigator.push( context, MaterialPageRoute( builder: (context) => ProductEditScreen(), settings: RouteSettings(arguments: new Product(id: 0, name: autoCompleteController.text)), ) ).then((result) async { Product newproduct = result; setState(() { textField.addSuggestion(newproduct); autoCompleteController.text = newproduct.getName; }); }); }, ) ), itemSubmitted: (item) => setState(() => selectedItem(item)), controller: autoCompleteController, key: autoCompleteKey, suggestions: products, suggestionsAmount: 5, itemBuilder: (context, suggestion) => new Padding( child: new ListTile( title: new Text(suggestion.getName), trailing: new Text(suggestion.getPoints != null ? "Punkte: ${suggestion.getPoints}" : "")), padding: EdgeInsets.all(8.0)), itemSorter: (a, b) => a.getName.compareTo(b.getName), itemFilter: (suggestion, input) => suggestion.getName.toLowerCase().contains(input.toLowerCase()), clearOnSubmit: false, ); }

The problem occurs when the suggestions are updated in the "OnTap" of IconButton in the ListTile on return of the widget which is called to add a new "Product" entry.

What works is that the suggestion is properly updated and shown in the overlay. What is broken is two things. First the currentText is wiped out and second when tapping on the newly created entry in the overlay it get's selected but the overlay doesn't close and stays open after selection even after clicking on another Widget in the same screen. To make it go away I have to type something in the autocomplete and then click somewhere else.

The method 'call' was called on null. Using AutoCompleteTextField

My view broke after a flutter update, it was working perfectly up until then.

flutter: ══╡ EXCEPTION CAUGHT BY FOUNDATION LIBRARY ╞════════════════════════════════════════════════════════
flutter: The following NoSuchMethodError was thrown while dispatching notifications for FocusNode:
flutter: The method 'call' was called on null.
flutter: Receiver: null
flutter: Tried calling: call(true)
flutter:
flutter: When the exception was thrown, this was the stack:
flutter: #0 Object.noSuchMethod (dart:core-patch/object_patch.dart:50:5)
flutter: #1 new AutoCompleteTextFieldState. (package:autocomplete_textfield/autocomplete_textfield.dart:182:4)
flutter: #2 ChangeNotifier.notifyListeners (package:flutter/src/foundation/change_notifier.dart:206:21)
flutter: #3 FocusNode._notify (package:flutter/src/widgets/focus_manager.dart:103:5)
flutter: #4 FocusManager._update (package:flutter/src/widgets/focus_manager.dart:474:20)
flutter: (elided 10 frames from package dart:async)
flutter:
flutter: The FocusNode sending notification was:
flutter: FocusNode#c112f(FOCUSED)

errorText not working

Hi,
I would want to change the message of the "errorText" value of the decoration after the "textChanged" event.

Then i have something like this:

return AutoCompleteTextField<String>(textChanged: (text) {
setState(() { if (test.length == 0) _notGood = true; else _notGood = false;},};
[...],
decoration: InputDecoration(errorText: _notGood ? 'Empty' : null,),);

The problem is that it's not working because the decoration that i pass in parameter is passed in the constructor of the AutoCompleteTextFieldState<T> class and like that its stay in "final" i can't do nothing to change it and the build method is not refreshing the TextField.

Here : https://github.com/felixlucien/flutter-autocomplete-textfield/blob/ff8d9ead701c2c5995c5d7e6417da33eb4adad28/lib/autocomplete_textfield.dart#L152

Is there any way to bypass this or for you to make a fix ?

Thank you !

when i don't select a item in autoCompleteTextField (android)

The Screen don't Open More

Another exception was thrown: setState() called after dispose(): AutoCompleteTextFieldState<banks>#f9733(lifecycle state: defunct, not mounted

Another exception was thrown: NoSuchMethodError: The method 'clear' was called on null

I/flutter ( 1454): When the exception was thrown, this was the stack:
I/flutter ( 1454): #0      Object.noSuchMethod  (dart:core-patch/object_patch.dart:50:5)
I/flutter ( 1454): #1      new AutoCompleteTextFieldState.<anonymous closure> 
package:autocomplete_textfield/autocomplete_textfield.dart:182
I/flutter ( 1454): #2      ChangeNotifier.notifyListeners 
package:flutter/…/foundation/change_notifier.dart:206
I/flutter ( 1454): #3      FocusNode._notify 
package:flutter/…/widgets/focus_manager.dart:103
I/flutter ( 1454): #4      FocusManager._update 
package:flutter/…/widgets/focus_manager.dart:474
I/flutter ( 1454): (elided 10 frames from package dart:async)
I/flutter ( 1454):
I/flutter ( 1454): The FocusNode sending notification was:
I/flutter ( 1454):   FocusNode#eab7a(FOCUSED)
I/flutter ( 1454): ════════════════════════════════════════════════════════════════════════════════════════════════════

Suggestions not showing dynamic list

Hi, is there a way to manually show the suggestions overlay?

I have this autocompletetextfield that gets it's suggestions from rest API. when I update the list of suggestions, the list is being updated but no suggestions are being shown.

I'm fairly new to Flutter and TYIA for the help

suggestions comes from server?

your plugin is awesome man Thank you,

what if my suggestions comes from server so i had to display what the server returns?

Using multiple autoComplete Textfield in same widget tree cause global key exception

Hi thanks for this amazing library, I was having an issue while using it and want to check if anyone knows how to solve.

I want to use the 2-3 autocomplete text fields on the same screen. But when I add it and run the app, I get the error Multiple widgets used the same GlobalKey.

This happens because the global key which is a required field cannot be used for more than 1 widget. There is a workaround by declaring our own key https://stackoverflow.com/questions/49862572/multiple-widgets-used-the-same-globalkey but autocomplete textfield do a type check and the above solution doesn't work.

For my use case, I am not using clear, is it possible to not make key required for such use cases? or is there any other suggestion.

Is itemBuilder scrollable?

i'm using the autocomplete, and i can't scroll the options that gave to me, and i know that has more information...
Is there a way to let scrollable the itemBuilder?

Thank's a lot!

Make Scrollable

Hi,

Your textfield is very usefull, but how could we make the suggestions scrollable ?

Thank you in advance,

Onblur Event

Hello,
Is it possible to reload the list from remote, When people finish writing?

For instance, you want to search starting with ab when you will finishing typing ab it should go to the server bring data and reload the listing.

loading? CircularProgressIndicator():searchTextField = AutoCompleteTextField(
key: key,
clearOnSubmit: false,
suggestions: users,
style: TextStyle(color: Colors.black, fontSize: 16.0),
decoration: InputDecoration(
contentPadding: EdgeInsets.fromLTRB(10.0, 30.0, 10.0, 20.0),
hintText: "Search Name",
suffixIcon: new Icon(Icons.search) ,
hintStyle: TextStyle(color: Colors.black),
),
itemFilter: (item, query) {

                return item.payee_name
                    .toLowerCase()
                    .startsWith(query.toLowerCase());
              },
              itemSorter: (a, b) {
                return a.payee_name.compareTo(b.payee_name);
              },
              itemSubmitted: (item) {
                setState(() {
                  searchTextField.textField.controller.text = item.payee_name.toString();
                  _payee_id = item.id.toString();

                });
              },

              textChanged: (item) {

                String keyword= searchTextField.textField.controller.text;

               setState(() {

                  **getUsers(keyword);**

               });

void getUsers(String keyword) async {
try {

  SharedPreferences prefs = await SharedPreferences.getInstance();
  final String payee_url  = PAYEE_GET_SUGGESTION_URL+prefs.get('_token')+"&keyword="+keyword;

  final response =
  await http.get(payee_url);
  if (response.statusCode == 200) {
    users = loadUsers(response.body);
    print('Users: ${users.length}');
    setState(() {
      loading = false;
    });
  } else {
    print("Error getting users.");
  }
} catch (e) {
  print("Error getting users.");
}

}

Question : How do we populate a changing suggestions list via a Future DB call?

I was just wondering if maybe you or someone has an example of a more complex situation like I want to implement . Well, did implement using a different Widget -- but want to convert to this one. Basically we have a TextField suggestion box -- but we want to debounce the text to 300 ms and take the result to query a DB to fill in the suggestions ..

Maybe with update suggestions (now added) this is pretty feasible? Just wondering best practices ..

Dialog wouldn't dismiss after submitted

Hi, felixlucien. That is not working anymore after i upgraded flutter version. It's able to prompt dialog if user input relevant to predefined list. but dialog wouldn't dismiss anymore after submitted. I attached error msg below. Thank you for your helping.

I/flutter ( 4443): ══╡ EXCEPTION CAUGHT BY FOUNDATION LIBRARY ╞════════════════════════════════════════════════════════
I/flutter ( 4443): The following NoSuchMethodError was thrown while dispatching notifications for FocusNode:
I/flutter ( 4443): The method 'call' was called on null.
I/flutter ( 4443): Receiver: null
I/flutter ( 4443): Tried calling: call(true)
I/flutter ( 4443):
I/flutter ( 4443): When the exception was thrown, this was the stack:
I/flutter ( 4443): #0 Object.noSuchMethod (dart:core-patch/object_patch.dart:50:5)
I/flutter ( 4443): #1 new AutoCompleteTextFieldState. (package:autocomplete_textfield/autocomplete_textfield.dart:182:4)
I/flutter ( 4443): #2 ChangeNotifier.notifyListeners (package:flutter/src/foundation/change_notifier.dart:206:21)
I/flutter ( 4443): #3 FocusNode._notify (package:flutter/src/widgets/focus_manager.dart:103:5)
I/flutter ( 4443): #4 FocusManager._update (package:flutter/src/widgets/focus_manager.dart:474:20)
I/flutter ( 4443): (elided 10 frames from package dart:async)
I/flutter ( 4443):
I/flutter ( 4443): The FocusNode sending notification was:
I/flutter ( 4443): FocusNode#06da5(FOCUSED)
I/flutter ( 4443): ════════════════════════════════════════════════════════════════════════════════════════════════════
I/flutter ( 4443): 1
W/IInputConnectionWrapper( 4443): getTextBeforeCursor on inactive InputConnection
I/flutter ( 4443): Another exception was thrown: NoSuchMethodError: The method 'call' was called on null.

prefill

Hello,
i love the autocomplete textfield.

But is it possible to prefill it with a text?

Greetings from Germany

Expose controller in constructor to initialize with starting text

When using a normal TextField, I can initialize the starting text:

Widget getAuthorField(Bloc bloc) {
  return StreamBuilder(
    stream: bloc.customAuthor,
    builder: (context, AsyncSnapshot<String> snapshot) {
      if (!snapshot.hasData) return SizedBox();
      final author = snapshot.data;
      authorController = TextEditingController.fromValue(
          TextEditingValue(
          text: author,
          selection: new TextSelection.collapsed(offset: author.length)
        )
      );
      return TextField(
        controller: authorController
      );
    },
    initialData: ''
  );
}

I'm not able to do this with AutoCompleteTextField:

Widget getAuthorField(Bloc bloc) {
  return StreamBuilder(
    stream: bloc.customAuthor,
    builder: (context, AsyncSnapshot<String> snapshot) {
      if (!snapshot.hasData) {
        return SizedBox();
      }
      autoCompleteAuthorField = createAutoCompleteAuthorInput(context, bookList, bloc);
      // both of these don't work inside the StreamBuilder
      // authorInputKey.currentState.textField.controller.text = snapshot.data;
      // autoCompleteAuthorField.textField.controller.text = snapshot.data;
      return autoCompleteAuthorField;
    },
    initialData: '',
  );
}

AutoCompleteTextField<ApprovedBook> createAutoCompleteTitleInput(BuildContext context, List<ApprovedBook> approvedBooks, Bloc bloc) {
  return AutoCompleteTextField<ApprovedBook>(
    key: titleInputKey,
    textChanged: (text) {
      bloc.changeCustomTitle(text);
    },
    decoration: storytimeInputDecoration('Title', Theme.of(context).accentColor, 'The title of the book', ''),
    itemSubmitted: (ApprovedBook book) {
      bloc.submitApprovedBook(book);
      _resetForm();
      Navigator.pushNamed(context, '/confirm_book');
    },
    suggestions: approvedBooks,
    itemFilter: (suggestion, input) {
      return suggestion.title.toLowerCase().startsWith(input.toLowerCase());
    },
    itemBuilder: (context, ApprovedBook suggestion) => Padding(
      padding: EdgeInsets.all(8),
      child: ListTile(
        title: Text('${suggestion.title} by ${suggestion.author}')
      )
    ),
    itemSorter: (a, b) => a.title.compareTo(b.title),
  );
}

I saw #11, where we can access the textField property after the AutoCompleteTextField has been built. But, that is not working for me using StreamBuilder. I get error:

flutter: isAuthenticated? true
flutter: ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
flutter: The following NoSuchMethodError was thrown building StreamBuilder<String>(dirty, dependencies:
flutter: [_LocalizationsScope-[GlobalKey#4ef5a], _InheritedTheme], state: _StreamBuilderBaseState<String,
flutter: AsyncSnapshot<String>>#fe9e7):
flutter: The getter 'textField' was called on null.
flutter: Receiver: null
flutter: Tried calling: textField
flutter:
flutter: When the exception was thrown, this was the stack:
flutter: #0      Object.noSuchMethod (dart:core/runtime/libobject_patch.dart:50:5)
flutter: #1      FindBookScreenState.getAuthorField.<anonymous closure>

Overlay position doesn't update

Here's an example app showing the issue:

import 'package:autocomplete_textfield/autocomplete_textfield.dart';
import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: AutoCompleteTextField<String>(
            suggestions: ["one", "two", "three"],
            itemBuilder: (context, suggestion) => Text(suggestion),
            itemFilter: (text, query) => text.toLowerCase().startsWith(query.toLowerCase()),
          )
        )
      )
    );
  }
}

The overlay position does not follow the TextField when TextField changes position due to the keyboard showing/hiding. A proper fix would be to update the overlay's position whenever the TextField changes position but I'm not sure how to detect for that. I ran into this issue with an AutoCompleteTextField in a dialog, then adding content to the dialog making it larger and pushing the AutoCompleteTextField up, but the overlay position did not change. So it's not an issue solely related to keyboard changes.

Change the width of the suggestion list

I use a autocomplete text field in my app Bar. On the left of this app bar, there is a burger icon and on the right another icon for starting/ending the search.
I would like the list of suggestion to take the width screen instead of only the text field width. Is it possible?

add autofocus support

Maybe I am missing it, but it seems that there isn't an easy way to autofocus the textfield (focus it immediately). Could you expose this field?

For those reading this, here is a hack in case you're in a pinch:

GlobalKey<AutoCompleteTextFieldState<String>> autoCompleteKey =
      GlobalKey();
  
  @override
  void initState() {
    super.initState();
    
    // focus SimpleAutoCompleteTextField after it builds
    WidgetsBinding.instance.addPostFrameCallback((_) => FocusScope.of(context)
        .requestFocus(autoCompleteKey.currentState.textField.focusNode));
  }

  @override
  Widget build(BuildContext context) {
    SimpleAutoCompleteTextField(
      key: autoCompleteKey);
    ...
  }

itemBuilder not responding to SetState.

I am currently trying to put a checkbox in the builder. The checkbox appears but does not respond when tapped. The value changes but the box itself does not change when the value changes. It remains to be the same color.


....


                  bool isChecked = false;

                   AutoCompleteTextField<String>(
                    suggestions: MySuggestion,
                    itemSubmitted: (item) {
                    setState(() => searchTextField.textField.controller.text =
                          item);                  
                    }
                    itemBuilder: (context, item) {
                     return Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: <Widget>[
                        Text(item,
                            style: TextStyle(
                        fontSize: 16.0
                        ),),
                    Padding(
                padding: EdgeInsets.all(15.0),
                   ),
                    Checkbox(
                         value: isChecked,
                         onChanged: (value) {
                        setState(() {
                        isChecked = value;
                       });
                       print(isChecked);
                        },
                       ),
                      ],
                    );          
                  }
              )`

Does the builder for the suggestion use a different context?

Add Validator and keyboardAppearance properties

Like in TextFormFields, it could be great if we can add the Validator property and the keyboardAppearance property.

Example for the Validator property :

TextFormField(
  // The validator receives the text the user has typed in
  validator: (value) {
    if (value.isEmpty) {
      return 'Please enter some text';
    }
  },
);

And for instance the keyboardAppearance property :

TextFormField(
// Here to apply a white keyboard 
    keyboardAppearance: Brightness.light,
),

How to change text field color.

I want to change the text field color. I tried so methods. No one working

searchTextField = AutoCompleteTextField<Keyword>(
    style: new TextStyle(color: Colors.black, fontSize: 18.0),
                       decoration:  new InputDecoration(
                         border: InputBorder.none,
                         fillColor: Colors.red,
          )

)

Is there any solution?

Error when touching autocomplete field

Hello,

I've updated flutter from 1.2.x to last stable release, 1.5.4 :

[√] Flutter (Channel stable, v1.5.4-hotfix.2, on Microsoft Windows [version 6.3.9600], locale fr-FR)

No changes to the code at all. I just tried to build the appbundle again and I got some errors regarding to this plugin. Using debug, this is the error message I get when I touch the autocomplete field (without typing anything) :

I/flutter (12956): ══╡ EXCEPTION CAUGHT BY FOUNDATION LIBRARY ╞════════════════════════════════════════════════════════
I/flutter (12956): The following NoSuchMethodError was thrown while dispatching notifications for FocusNode:
I/flutter (12956): The method 'call' was called on null.
I/flutter (12956): Receiver: null
I/flutter (12956): Tried calling: call(true)
I/flutter (12956): 
I/flutter (12956): When the exception was thrown, this was the stack:
I/flutter (12956): #0      Object.noSuchMethod (dart:core-patch/object_patch.dart:50:5)
I/flutter (12956): #1      new AutoCompleteTextFieldState.<anonymous closure> (package:autocomplete_textfield/autocomplete_textfield.dart:182:4)
I/flutter (12956): #2      ChangeNotifier.notifyListeners (package:flutter/src/foundation/change_notifier.dart:206:21)
I/flutter (12956): #3      FocusNode._notify (package:flutter/src/widgets/focus_manager.dart:103:5)
I/flutter (12956): #4      FocusManager._update (package:flutter/src/widgets/focus_manager.dart:474:20)
I/flutter (12956): (elided 10 frames from package dart:async)
I/flutter (12956): 
I/flutter (12956): The FocusNode sending notification was:
I/flutter (12956):   FocusNode#30503(FOCUSED)
I/flutter (12956): ════════════════════════════════════════════════════════════════════════════════════════════════════

I experienced this with flutter-autocomplete-textfield 1.6.4 but I updated to last version 1.6.6 and I'm facing the same issue.

I tried to rollback to flutter v1.2.2 and this issue doesn't occur.

Has someone got the same issue?

Thanks

Method 'call' was called on null

This error let the Widget work but continues to appear on the log screen:
Another exception was thrown: NoSuchMethodError: The method 'call' was called on null.

AutoCompleteTextFieldState not disposing

  1. Navigation is Popped while autocomplete is in focus with a list of items being displayed and no item is selected.
  2. When the ensuing Navigation screen is popped, the following exception is thrown.

Both Widgets use which create back button at the top:
return new Scaffold(
appBar: AppBar(
title: Text("Title"),
),
body: ....

════════ Exception caught by gesture ═══════════════════════════════════════════════════════════════
The following assertion was thrown while handling a gesture:
setState() called after dispose(): AutoCompleteTextFieldState#0a15a(lifecycle state: defunct, not mounted)

This error happens if you call setState() on a State object for a widget that no longer appears in the widget tree (e.g., whose parent widget no longer includes the widget in its build). This error can occur when code calls setState() from a timer or an animation callback.

The preferred solution is to cancel the timer or stop listening to the animation in the dispose() callback. Another solution is to check the "mounted" property of this object before calling setState() to ensure the object is still in the tree.
This error might indicate a memory leak if setState() is being called because another object is retaining a reference to this State object after it has been removed from the tree. To avoid memory leaks, consider breaking the reference to this object during dispose().

When the exception was thrown, this was the stack:
#0 State.setState. (package:flutter/src/widgets/framework.dart:1105:9)
#1 State.setState (package:flutter/src/widgets/framework.dart:1140:6)
#2 AutoCompleteTextFieldState.updateOverlay... (package:autocomplete_textfield/autocomplete_textfield.dart:322:37)
#3 _InkResponseState._handleTap (package:flutter/src/material/ink_well.dart:654:14)
#4 _InkResponseState.build. (package:flutter/src/material/ink_well.dart:729:32)
...

Losing focus doesn't update the overlay

Having multiple widgets and a user focus' on another widget the overlay doesn't update.

My suggestion would be updating the overlay as well when the filteredSuggestions are cleared.

textField.focusNode.addListener(() {
      if (!textField.focusNode.hasFocus) {
        filteredSuggestions = [];
        updateOverlay("");
      }
});

How do I change actual text field text value?

in usual TextFeild using controller.text to modify TextField's text value.
This widget don't have Textfield controller How can I modify text in TextField.

for delete text , using clear() understand, what if I want "location:New York" for search text bar.

Minimal Setup

I think that this widget asks for too many mandatory parameters. A lot of them could simply take a Default action (I think deserves for 90% of the use cases), instead of asking to the user to pass them always.

i.e. itemFilter, itemSorter, itemSubmitted(?), key(?), controller(?)

AutoCompleteTextFieldState.updateOverlay.<anonymous closure>

The Plugin is crashing when we go back & forth in the App with setState() called after dispose() at line 240, we need to have the setState mounted in the plugin
AutoCompleteTextFieldState.updateOverlay...
package:autocomplete_textfield/autocomplete_textfield.dart:240
STACK:
flutter: solution is to check the "mounted" property of this object before calling setState() to ensure the
flutter: object is still in the tree.
flutter: This error might indicate a memory leak if setState() is being called because another object is
flutter: retaining a reference to this State object after it has been removed from the tree. To avoid memory
flutter: leaks, consider breaking the reference to this object during dispose().
flutter:
flutter: When the exception was thrown, this was the stack:
flutter: #0 State.setState.
package:flutter/…/widgets/framework.dart:1095
flutter: #1 State.setState
package:flutter/…/widgets/framework.dart:1121
flutter: #14 _WidgetsFlutterBinding&BindingBase&GestureBinding._flushPointerEventQueue
package:flutter/…/gestures/binding.dart:101
flutter: #15 _WidgetsFlutterBinding&BindingBase&GestureBinding._handlePointerDataPacket
package:flutter/…/gestures/binding.dart:85

flutter: #19 _invoke1 (dart:ui/hooks.dart:223:10)
flutter: #20 _dispatchPointerDataPacket (dart:ui/hooks.dart:144:5)
flutter: (elided 3 frames from package dart:async)
flutter:
flutter: Handler: onTap
flutter: Recognizer:
flutter: TapGestureRecognizer#6e03f(debugOwner: GestureDetector, state: accepted, won arena, finalPosition:
flutter: Offset(34.5, 39.5), sent tap down)
flutter: ════════════════════════════════════════════════════════════════════════════════════════════════════

Not Showing items overlay in my view hierarchy but it manages to..

Not Showing items overlay in my view hierarchy but it manages to execute itemFilter and itemBuilder with desired results. Is there something in this layout below stopping to show results.

Parents from top Scaffold -> Stack -> Container -> Card ->ListView:

First LAyout:

Container(
 child: textFieldCities,
),

But showing the result using this layout with height set on containing Container

 Container(
    height: 300.0,
    child: textFieldStates,
  ),

But this is ugly and not desired to manually put height and the resulting overlay glides through all this 300. height

The suggestions appear in Overlay which is covered by software keyboard

image

See the screenshot above. Notice the blue line just above the keyboard? This is the suggestion popup. The position is calculated incorrectly when software keyboard is open. Hiding the keyboard allows me to see the suggestion, but 99% of the people will not notice.
I suggest to (a) detect the height of the software keyboard and adjust the position accordingly. Or (b) attach the position to the text field. The suggestions should scroll WITH the page. Currently suggestions float ABOVE the page.
What do you think?

How to add inputFormatters?

  `AutoCompleteTextField textField;
   ....
   textField.key.currentState.textField.inputFormatters.add(
    WhitelistingTextInputFormatter(RegExp("^[A-Za-z0-9]+");`

This gives null exception. Thank you!

Debounce textChanged

Is there a way to debounce the textChange in order to not flood the server with API calls every time you input a text?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.