Flutter自动完成:如何将选定选项设置为空

exdqitrt  于 2023-06-30  发布在  Flutter
关注(0)|答案(1)|浏览(109)

自动完成始终选择已找到匹配项的下拉列表中的第一个元素。如何使下拉列表中的元素不被选中。我希望用户手动选择项目(onTap)。
这里有一个例子。键入“a”将自动选择下拉列表中的第一项。我不希望第一个元素被选中(即null或类似的东西)
我想,如果用户输入一个“a”,一个下拉菜单显示,但没有选择任何元素,没有元素被接受时,确认输入.

nimxete2

nimxete21#

UPDATE新增fieldViewBuilder,防止回车时选择。

要实现这一点,您可以使用optionsViewBuilder,如下所示:

Autocomplete<String>(
  fieldViewBuilder:
      (context, textEditingController, focusNode, onFieldSubmitted) {
    return TextFormField(
      controller: textEditingController,
      focusNode: focusNode,
    );
  },
  optionsBuilder: (TextEditingValue textEditingValue) {
    if (textEditingValue.text == '') {
      return const Iterable<String>.empty();
    }
    return _kOptions.where((String option) {
      return option.contains(textEditingValue.text.toLowerCase());
    });
  },
  optionsViewBuilder: (
    BuildContext context,
    AutocompleteOnSelected<String> onSelected,
    Iterable<String> options,
  ) {
    return Align(
      alignment: Alignment.topLeft,
      child: Material(
        elevation: 4.0,
        child: Container(
          constraints: const BoxConstraints(maxHeight: 200),
          child: ListView.builder(
            padding: const EdgeInsets.all(8.0),
            itemCount: options.length,
            shrinkWrap: true,
            itemBuilder: (BuildContext context, int index) {
              final String option = options.elementAt(index);
              return GestureDetector(
                onTap: () {
                  onSelected(option);
                },
                child: ListTile(
                  title: Text(option),
                ),
              );
            },
          ),
        ),
      ),
    );
  },
  onSelected: (String selection) {
    debugPrint('You just selected $selection');
  },
)

现在没有预选选项:

相关问题