Question

TextField小部件似乎没有“limit”属性来限制可以键入的字符数。我如何强制在TextField Widget中只能提供一定数量的字符作为输入。我试着查看装饰属性并可能以某种方式设置限制，但这似乎也没有用。我应该使用不同的小部件吗？

Answer 1

Flutter中提供了maxLength属性

https://docs.flutter.io/flutter/material/TextField/maxLength.html

只需在TextField

的属性中添加maxLength: 45,即可

Answer 2

使用 inputFormatters 属性

示例：

TextFormField(
      inputFormatters: [
        LengthLimitingTextInputFormatter(10),
      ]
    )

命名空间

import 'package:flutter/services.dart';

Answer 3

对于正在阅读问题的开发者：

TextField(
    inputFormatters: <TextInputFormatter>[
        LengthLimitingTextInputFormatter(11),
    ],
),

Answer 4

您可以使用TextEditingController控制文本字段的所有内容。因此，如果您要将此信息与TextField中的onChanged事件配对，您可以在此处执行任何您想要的逻辑。例如：

TextEditingController _controller = new TextEditingController();
String text = ""; // empty string to carry what was there before it onChanged
int maxLength = ...
...
new TextField(
    controller: _controller,
    onChange: (String newVal) {
        if(newVal.length <= maxLength){
            text = newVal;
        }else{
            _controller.text = text;
        }

    }
)

我能够控制文本字段以保持在指南范围内，因为如果它超过它，它将恢复到最后一种类型之前的状态。

Answer 5

我不得不在RSproute提到的内容中添加一个额外的片段。完整的代码在这里：

TextEditingController _controller = new TextEditingController();
String text = ""; // empty string to carry what was there before it 
onChanged
int maxLength = ...
...
new TextField(
    controller: _controller,
    onChange: (String newVal) {
        if(newVal.length <= maxLength){
            text = newVal;
        }else{
            _controller.value = new TextEditingValue(
                text: text,
                selection: new TextSelection(
                    baseOffset: maxLength,
                    extentOffset: maxLength,
                    affinity: TextAffinity.downstream,
                    isDirectional: false
                ),
                composing: new TextRange(
                    start: 0, end: maxLength
                )
            );
            _controller.text = text;
        } 
    }
);

Answer 6

您可以使用maxLength属性，并且仍可以通过将counterText设置为空字符串来隐藏底部的计数器文本。

&genericStruct

Answer 7

在 1.25 版中，这更容易。 maxLengthEnforced 属性需要设置为 true。否则上面的响应将不起作用。

     Container(
                  margin: EdgeInsets.only(right: 5),
                  child: SizedBox(
                    width: 70,
                    child: TextField(
                      keyboardType: TextInputType.number,
                      maxLengthEnforced: true,
                      maxLength: 2,
                      decoration: InputDecoration(
                        labelText: 'Hours',
                        counterText: '',
                      ),
                      controller: hourField,
                    ),
                  ),
                ),

Answer 8

您可以使用此代码来抄袭限制长度和隐藏计数器：

您可以找到here的原始答案。

Answer 9

有两种方法可以做到这一点

方案一

LengthLimitingTextInputFormatter 创建一个格式化程序，防止插入超过限制的字符。

      TextField(              
              inputFormatters: [
                new LengthLimitingTextInputFormatter(5), /// here char limit is 5
              ],
                ///....
              )

解决方案二：

          TextField(
                  maxLength: 5, /// here char limit is 5

如果您不想在 TextField 底部显示计数器文本，请在 counterText 中添加空的 InputDecoration

示例：

TextField(
              maxLength: 100,
              decoration: InputDecoration(
                  counterText: '',
                  ///....

如何限制flutter中文本字段的大小？

9 个答案: