flutter - 在不在中心的文本表单字段上显示对话框

Question

我试图在用户单击 texform 字段时显示对话框，但它显示在屏幕中央而不是 textformfield 上？请帮我..

Answer 1

您可以使用DropDownButton而不是对话框来实现您的目标 在此处输入链接描述

Answer 2

您可以使用 TypeAheadFormField 包将文本字段用作文本字段以及下拉菜单。请找到示例示例代码

 TypeAheadFormField(
      textFieldConfiguration: TextFieldConfiguration(
        controller: textFieldController,  
        autofocus: false,
        textAlign: TextAlign.center,
        onSelection: (selectedItem) {
      print(selectedItem);
    },
        decoration: InputDecoration(
          isDense: true,
          fillColor: Color(0xFFEAEAEA),
          filled: true,
          border: OutlineInputBorder(
            borderSide: BorderSide.none,
       ),
      ),   
      keepSuggestionsOnLoading: false,
      suggestionsCallback: (pattern) => getSuggestions(searchList, pattern),
      itemBuilder: (context, suggestion) => ListTile(
        title: Text(suggestion),
      ),
      transitionBuilder: (context, suggestionsBox, controller) =>
          suggestionsBox,
      onSuggestionSelected: (suggestion) {
        if (onSelection != null) {
          onSelection(suggestion);
        }
        textFieldController.text = suggestion;
      },
      getImmediateSuggestions: true,
    )
List<String> getSuggestions(List<String>  searchList, String query) {
final filtered = searchList
    .where((item) => item.toLowerCase().contains(query.toLowerCase()));
return filtered.toList();}

其中 searchList 是要在文本字段上显示的列表。

Answer 3

试试这个，我想它对你有帮助！

class _YourPageState extends State<YourPage> {
  Map yourJson = {
    "status": true,
    "message": "success",
    "data": {
      "list": [
        {"idattribute": "2", "attrName": "BBQ"},
        {"idattribute": "1", "attrName": "FRUIT JUICE"}
      ]
    }
  };
  int _value = 1;
  List<DropdownMenuItem<int>> _menuItems;

  @override
  void initState() {
    super.initState();

    List dataList = yourJson["data"]["list"];
    _menuItems = List.generate(
      dataList.length,
          (i) => DropdownMenuItem(
        value: int.parse(dataList[i]["idattribute"]),
        child: Text("${dataList[i]["attrName"]}"),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: DropdownButton<int>(
          items: _menuItems,
          value: _value,
          onChanged: (value) => setState(() => _value = value),
        ),
      ),
    );
  }
}