如何检测何时在Flutter中选择了TextField? [英] How to detect when a TextField is selected in Flutter?

问题描述

愚蠢的Flutter新手问题在这里...

我有一个颤振的TextField它获取由软键盘被选择场时覆盖.显示键盘时，我需要向上滚动该字段并使其不碍事.这是一个非常普遍的问题，此 StackOverflow中提供了一种解决方案发布.

我想我已经找到了 ScrollController 部分，但是如何检测到何时选择了 TextField ?似乎没有任何事件方法(例如onFocus()，onSelected()，onTap()等).

我尝试将TextField包裹在 GestureDetector 中，但这也不起作用-显然事件从未被捕获.

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

这是一个基本要求，我知道必须有一个简单的解决方案.

感谢您的帮助.

解决方案

我想您正在寻找 FocusNode .

要收听焦点更改，可以在FocusNode上添加一个列表器，并将focusNode设置为TextField.

示例:

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

这要点表示如何确保焦点集中的节点在ui上可见. >

希望有帮助！

Stupid Flutter newbie question here...

I have a Flutter TextField which gets covered by the soft keyboard when the field is selected. I need to scroll the field up and out of the way when the keyboard is displayed. This is a pretty common problem and a solution is presented in this StackOverflow post.

I think I have the ScrollController part figured out but how do I detect when the TextField has been selected? There doesn't appear to be any event method (e.g. onFocus(), onSelected(), onTap(), etc).

I tried wrapping the TextField in a GestureDetector but that didn't work either -- apparently the event was never captured.

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

This is such a basic requirement that I know there must be an easy solution.

Thanks for the help.

解决方案

I suppose you are looking for FocusNode.

To listen to focus change, you can add a listner to the FocusNode and specify the focusNode to TextField.

Example:

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 represents how to ensure a focused node to be visible on the ui.

Hope it helps!

这篇关于如何检测何时在Flutter中选择了TextField?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！