我有一个小部件,可渲染TextFormFields的ListView来输入数据。但是,我想动态更改我的一个文本字段的键盘类型。这是小部件的概述:


class CreateTodo extends StatefulWidget {
  @override
  _CreateTodoState createState() => _CreateTodoState();
}

class _CreateTodoState extends State<CreateTodo> {
  final _formKey = GlobalKey<FormState>();
  final double formWidth = 175.0;

  final Map<String, Icon> itemsMap = {
    'Heading': Icon(Icons.title),
    'Description': Icon(Icons.edit),
    'Date': Icon(Icons.calendar_today)
  };

  final items = ['Heading', 'Description', 'Date'];

  _changeKeyboardType(entry) {
    if (entry == "Description") {
      return TextInputType.multiline;
    }

    return TextInputType.text;
  }

  ListView createListItems() {
    return ListView.builder(
      padding: EdgeInsets.only(
        left: 50.0,
        right: 50.0,
        top: 20.0
      ),
      scrollDirection: Axis.vertical,
      itemCount: 3,
      itemBuilder: (context, index) {
        var currentHeading = this.items[index];
        var currentIcon = this.itemsMap[currentHeading];

        return Padding(
          padding: EdgeInsets.only(bottom: 50.0),
          child: new TextFormField(
              validator: (input) {
                if (input.isEmpty) {
                  return 'You must enter a ${currentHeading.toLowerCase()} for your to-do';
                }
              },
              keyboardType: this._changeKeyboardType(currentHeading),
              decoration: new InputDecoration(
                prefixIcon: currentIcon,
                labelText: currentHeading,
                border: OutlineInputBorder(),
              ),
            )
        );
      }
    );
  }

  @override
  Widget build(BuildContext context) {
    return Form(
      autovalidate: true,
      child: Expanded(
        child: (this.createListItems())
      )
    );
  }
}

无法正常工作的主线是:keyboardType: this._changeKeyboardType(currentHeading) ...我是否以错误的方式处理此问题?任何方向都将非常有帮助。我基本上希望描述的textFormFeld是多行的,以便用户可以对其描述进行更好的可视化。

最佳答案

我目前的工作解决方案:

// Where entry is an object containing its focusNode and textInputType
entry.focusNode.unfocus();
setState(() {
  entry.textInputType = type;
});
// The delay was necessary, otherwise only the 2nd tap would actually change
Future.delayed(const Duration(milliseconds: 1), () {
  FocusScope.of(context).requestFocus(entry.focusNode);
});

到目前为止,我唯一无法解决的缺点是,键盘在消失后又重新出现了新的TextInputType

Google的Spreadsheet应用程序无需关闭即可立即完成操作,很想知道在Flutter中该方法是否可行以及如何实现。

您必须更改逻辑,因为我的示例是异步的。
让我知道这是否有帮助,或者您是否需要更多帮助。
或者,如果您已经弄清楚了,您是如何做到的

鸣谢:灵感来自https://stackoverflow.com/a/58498474/3484824

关于dart - [Flutter/Dart]:如何在表单中动态更改TextFormField的键盘类型?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/54634505/

10-13 07:54
查看更多