web-dev-qa-db-ja.com

FlutterでTextFieldが選択されたことを検出する方法は?

ここで愚かなフラッター初心者の質問...

フィールドを選択するとソフトキーボードで覆われるFlutter TextFieldがあります。キーボードが表示されているときに、フィールドをスクロールして邪魔にならないようにする必要があります。これは非常に一般的な問題であり、解決策はこの StackOverflow post に示されています。

私はScrollController部分を理解していると思いますが、TextFieldが選択されましたか?イベントメソッド(onFocus()、onSelected()、onTap()など)は存在しないようです。

TextFieldをGestureDetectorでラップしようとしましたが、それでも機能しませんでした。明らかにイベントはキャプチャされませんでした。

new GestureDetector(
  child: new TextField(
    decoration: const InputDecoration(labelText: 'City'),
  ),
  onTap: () => print('Text Selected'),
),

これは非常に基本的な要件であるため、簡単な解決策が必要であることがわかっています。

助けてくれてありがとう。

13
user2785693

FocusNode を探していると思います。

フォーカスの変更をリッスンするには、FocusNodeにリスナーを追加し、focusNodeTextFieldを指定できます。

例:

class TextFieldFocus extends StatefulWidget {
  @override
  _TextFieldFocusState createState() => new _TextFieldFocusState();
}

class _TextFieldFocusState extends State<TextFieldFocus> {
  FocusNode _focus = new FocusNode();

  TextEditingController _controller = new TextEditingController();

  @override
  void initState() {
    super.initState();
    _focus.addListener(_onFocusChange);
  }

  void _onFocusChange(){
    debugPrint("Focus: "+_focus.hasFocus.toString());
  }

  @override
  Widget build(BuildContext context) {
    return new Container(
      color: Colors.white,
      child: new TextField(
        focusNode: _focus,
      ),
    );
  }
}

This Gistは、フォーカスされたノードがUIに表示されるようにする方法を表します。

それが役に立てば幸い!

25
Hemanth Raj

最も簡単で簡単な解決策は、TextFieldにonTapメソッドを追加することです。

TextField(
  onTap: () {
    print('Editing stated $widget');
  },
)
1
Ankur Prakash