Question

我有textfield，它使用autocomplete_textfield软件包在用户输入时显示自动完成建议。现在，我想在textfield中显示选定的建议，为此，我正在itemSubmitted()方法中使用setState() { currentText = item.<suggestedText>}在控制台中正确打印值，但是我不确定如何在textfield中显示该值。如果我没有记错，我需要使用TextEditingController来检索和设置textfield中的值，但是不确定如何在TextEditingController中使用AutoCompleteTextField。

下面的当前代码：

@override
  void initState() {
    _loadData();
    textField = AutoCompleteTextField<Categories>(
      style: new TextStyle(color: Colors.white, fontSize: 16.0),
        decoration: new InputDecoration(
            suffixIcon: Container(
              width: 85.0,
              height: 60.0,
              color: Colors.green,
              child: new IconButton(
                icon: new Image.asset(
                  'assets/search_icon_ivory.png',
                  color: Colors.white,
                  height: 18.0,
                ),
                onPressed: () {},
              ),
            ),
            fillColor: Colors.black,
            contentPadding: EdgeInsets.fromLTRB(10.0, 30.0, 10.0, 20.0),
            filled: true,
            hintText: 'Search',
            hintStyle: TextStyle(color: Colors.white)),
        itemSubmitted: (item) {
          setState(() {
            currentText = item.autocompleteterm;
            print(currentText);
          });
        },
        submitOnSuggestionTap: true,
        clearOnSubmit: true,
        textChanged: (item) {
        },
        key: key,
        suggestions: CategoryViewModel.categories,
        textInputAction: TextInputAction.go,
        itemBuilder: (context, item) {
          return new Container(
            color: Colors.black87,
            child: Padding(
              padding: EdgeInsets.all(8.0),
              child: new Text(item.autocompleteterm,
              style: TextStyle(
                color: Colors.white70,
                fontSize: 16.0
              )),
            ),
          );
        },
        itemSorter: (a, b) {
          return a.autocompleteterm.compareTo(b.autocompleteterm);
        },
        itemFilter: (item, query) {
          return item.autocompleteterm
              .toLowerCase()
              .startsWith(query.toLowerCase());
        },
        );
    super.initState();
    _getUser();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        resizeToAvoidBottomPadding: false,
        backgroundColor: Color(0xFF13212C),
        appBar: AppBar(
          title: Text('Demo'),
        ),
        drawer: appDrawer(),
        body: new Center(
            child: new Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                children: <Widget>[
              new Column(children: <Widget>[
                textField,
              ]),

Answer 1

可以这样实现：

itemSubmitted: (item) {
          setState(() => textField.textField.controller.text = item.autocompleteterm);
          },

使clearOnSubmit: false能够在文本字段中显示选定的值。

如何在AutoCompleteTextField中设置值？

1 个答案: