首页 > 解决方案 > 在listview颤动中的textformfield中按下数字后键盘关闭

问题描述

我有一个 ReorderableListView 调用一个函数,该函数生成带有 TextTormFields、两个文本和一个数字的卡片,问题是当按下键盘上的任何字符后专注于数字文本字段时,键盘关闭。

Expanded(
              child: ReorderableListView(
                onReorder: _onReorder,
                scrollDirection: Axis.vertical,
                padding: const EdgeInsets.symmetric(vertical: 8.0),
                children: List.generate(
                  itemsList.length,
                      (index) {
                    return _buildItemCard(itemsList[index],index,_numberController);
                  },
                ),
              )
      
_buildItemCard(Map item, int index){

return Container(
    width: MediaQuery.of(context).size.width * 1,
    height: 200,
    key: Key(index.toString()),
    child: Card(
      elevation: 2,
      child: Container(
        decoration: BoxDecoration(
          color: colorPrimaryWhite,
          border: Border.all(color: Colors.black, width: 0.5),
          borderRadius: _borderRadius,
        ),
        child: Column(children: <Widget>[
          Row(children: [
            Container(
              width: MediaQuery.of(context).size.width * 0.45,
              height: 100,
              child: TextFormWidget(
                L10n.of(context).field1Text,
                text: item["field1"],
                maxLines: 2,
                icon: Icons.description,
                validator: (text) {
                  bool result = Validator.isNotNullNorEmpty(text);
                  if (result) {
                    item["field1"] = text;
                  }
                  return result;
                },
                autovalidate: true,
                validationErrorText: L10n.of(context).formsFillThisFieldError,
              ),
            ),
            Container(
              width: MediaQuery.of(context).size.width * 0.45,
              height: 100,
              child: TextFormWidget(
                L10n.of(context).field2Text,
                text: item["field2"],
                maxLines: 2,
                validator: (text) {
                  bool result = Validator.isNotNullNorEmpty(text);
                  if (result) {
                    item["field2"] = text;
                  }
                  return result;
                },
                autovalidate: true,
                validationErrorText: L10n.of(context).formsFillThisFieldError,
              ),
            )
          ]),
          Row(children: [
            Container(
              width: MediaQuery.of(context).size.width * 0.45,
              height: 80,
              child: TextFormWidget(
                "",
                text: item["field3"].toStringAsFixed(0),
                maxLines: 1,
                maxLength: 5,
                icon: Icons.attach_money,
                onChanged: (v, c) {
                  bool result = Validator.isPositiveDouble(v);
                  if (result) {
                    item["field3"] = double.parse(v);
                  }
                  setState(() {});
                },
                inputFormatters: [
                  WhitelistingTextInputFormatter.digitsOnly,
                  LengthLimitingTextInputFormatter(15),
                ],
                keyboardType:
                TextInputType.numberWithOptions(decimal: true, signed: false),
              ),
            ),
            Flexible(flex: 1, child: new Container()),
            IconButton(
              icon: Icon(Icons.delete),
              iconSize: 40,
              onPressed: () => _deleteDialog(index),
            )
          ],)
        ]),
      ),
    )
);

而 TextfieldWidget 只是一种调用文本字段的简单方法,基本上是这样的:

TextFormField _buildTextFormField() {
TextFormField field = TextFormField(
  controller: widget.controller ?? null,
  key: widget.localKey ?? null,
  validator: (value) {
    if (widget.validator != null) {
      return widget.validator(value) ? null : widget.validationErrorText;
    }
    return null;
  },
  onTap: widget.onTap != null ? ()=> widget.onTap(widget.controller) : null,
  onChanged: widget.onChanged != null ? (val)=> widget.onChanged(val, widget.controller) : null,
  enabled: widget.enabled ?? true,
  initialValue: widget.text ?? null,
  maxLength: widget.maxLength ?? null,
  autovalidate: widget.autovalidate ?? false,
  maxLines: widget.maxLines ?? null,
  decoration: InputDecoration(
    icon: widget.icon != null ? Icon(widget.icon) : null,
    hintText: widget.hintText,
    labelText: widget.label,

  ),
  inputFormatters: widget.inputFormatters ?? null,
  keyboardType: widget.keyboardType ?? null,
  obscureText: widget.obscureText ?? false,
);
return field;

}

任何帮助,将不胜感激。提前致谢。

标签: androidformsflutter

解决方案


我在课程的开头添加了一个 GlobalKeys 列表,并从列表视图中添加了键

Expanded(
          child: ReorderableListView(
            onReorder: _onReorder,
            scrollDirection: Axis.vertical,
            padding: const EdgeInsets.symmetric(vertical: 8.0),
            children: List.generate(
              itemsList.length,
                  (index) {
                _keys.add(GlobalKey<FormFieldState>());
                return _buildItemCard(itemsList[index],index,_numberController);
              },
            ),
          )

并在 te TextFormWidget 中使用它。


推荐阅读