Managing events in flutter's TextFormField

问题

In Flutter project, I need to listen to the input text in TextFormField and do certain actions, especially when user put some character (eg. space) in this filed or when he request focus. When this kind of event happen, I need to modify filed's value. I know there is a property called controller but I don't know how to use it in this case.

Thank you in advance.

回答1:

You can specify a controller and focus node, then add listeners to them to monitor for changes.

Ex:

Define controllers and focus nodes

TextEditingController _controller = new TextEditingController();

FocusNode _textFocus = new FocusNode();

Define listener function

void onChange(){
  String text = _controller.text;
  bool hasFocus = _textFocus.hasFocus;
  //do your text transforming
  _controller.text = newText;
  _controller.selection = new TextSelection(
                                baseOffset: newText.length, 
                                extentOffset: newText.length
                          );
}

Add listner to controller and focusnode at initState

// you can have different listner functions if you wish
_controller.addListener(onChange); 
_textFocus.addListener(onChange);

Then you can use it as

new TextFormField(
  controller: _controller,
  focusNode: _textFocus,
)

Hope that helps!

回答2:

If you are just trying to transform the input to other form in TextFormField, you better use "TextInputFormatter". Using a listener with TextController cause a lot of troubles. Take a look at my sample code see if that helps you. btw, The last line of code is just trying to move the cursor to the end of text.

TextFormField(inputFormatters: [QuantityInputFormatter()])

class QuantityInputFormatter extends TextInputFormatter {
  @override
  TextEditingValue formatEditUpdate(TextEditingValue oldValue, TextEditingValue newValue) {
    final intStr = (int.tryParse(newValue.text) ?? 0).toString();
    return TextEditingValue(
            text: intStr, selection: TextSelection.collapsed(offset: intStr.length),);
  }
}

来源：https://stackoverflow.com/questions/48870082/managing-events-in-flutters-textformfield

标签

dart

listener

textfield

Flutter