web-dev-qa-db-ja.com

flutterのTextFormFieldでイベントを管理する

Flutterプロジェクトでは、特にユーザーがこのフィールドに文字(スペースなど)を入力したとき、またはフォーカスを要求したときに、TextFormFieldの入力テキストを聞いて特定のアクションを実行する必要があります。この種のイベントが発生した場合、フィールドの値を変更する必要があります。プロパティがあることを知っていますcalled controllerしかし、この場合の使用方法はわかりません。

前もって感謝します。

10
mynameis

コントローラーとフォーカスノードを指定してから、リスナーを追加して変更を監視できます。

例:

コントローラーの定義とノードのフォーカス

TextEditingController _controller = new TextEditingController();

FocusNode _textFocus = new FocusNode();

リスナー関数を定義する

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
                          );
}

initStateでコントローラーとfocusnodeにリスナーを追加します

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

その後、次のように使用できます

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

お役に立てば幸いです!

32
Hemanth Raj

TextFormFieldで入力を他のフォームに変換しようとしている場合は、「TextInputFormatter」を使用する方が適切です。 TextControllerでリスナーを使用すると、多くの問題が発生します。私のサンプルコードを見て、それが役立つかどうかを確認してください。ところで、コードの最後の行は、カーソルをテキストの最後に移動しようとしているだけです。

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),);
  }
}
1
Panda World