颤振更新文字

Question

在Flutter中，inputDecoration's的计数器文本属性不会随着用户在TextFormField中的键入而改变。在用户键入文字时，可以减少原语吗？

TextFormField(
 keyboardType: TextInputType.number,
 decoration: new InputDecoration(
   counterText: "9",
   hintText: "Enter exact order number",
  ),
)

Answer 1

我不建议使用decoration: InputDecoration::counterText。您必须使用setState或其他任何方式来手动更新计数器。

相反，我建议使用maxLength属性，该属性会自动创建一个计数器并对其进行更新：

TextField(maxLength: 8)

结果：

这可能是大多数人想要的。

您甚至可以使用buildCounter参数对其进行自定义，以在文本长度更改时返回所需的任何小部件。例如，如果您只想显示剩余的字符数，则可以执行以下操作：

TextField(
  maxLength: 8,
  buildCounter: (
    BuildContext context, {
    int currentLength,
    int maxLength,
    bool isFocused,
  }) {
    return Text('${maxLength - currentLength}');
  },
)

Answer 2

我编辑此answer以处理您的问题

class StackEditText extends StatefulWidget {
  @override
  _StackEditTextState createState() => _StackEditTextState();
}

class _StackEditTextState extends State<StackEditText> {

  TextEditingController _controller = new TextEditingController();

  void onValueChange() {
      setState(() {
        _controller.text;
      });
  }

  @override
  void initState() {
    super.initState();
    _controller.addListener(onValueChange);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Container(
        child: TextFormField(
          controller: _controller,
          maxLength: 9,
          decoration: InputDecoration(
            counterText: "${9 - _controller.text.length}",
            hintText: 'Enter exact order number',
          ),
        ),
      ),
    );
  }
}