Flutter中焦点控制FocusNode、Flutter输入框焦点事件的捕捉与监听

在Flutter使用FocusNode来捕捉监听TextField的焦点获取与失去，同时也可通过FocusNode来使用绑定对应的TextField获取焦点与失去焦点。

FocusNode的使用分四步，如下：

第一步创建FocusNode，代码如下：

//创建FocusNode对象实例

FocusNode focusNode = FocusNode();

```

第二步初始化函数中添加焦点监听，代码如下：

```java

/// 输入框焦点事件的捕捉与监听

@override

void initState() {

super.initState();

//添加listener监听

//对应的TextField失去或者获取焦点都会回调此监听

focusNode.addListener((){

if (focusNode.hasFocus) {

print('得到焦点');

}else{

print('失去焦点');

}

});

}

第三步在TextField中引用FocusNode，代码如下：

new TextField(

//引用FocusNode

focusNode: focusNode,

),

第四步在页面Widget销毁时，释放focusNode，代码如下：

//页面销毁

@override

void dispose() {

super.dispose();

//释放

focusNode.dispose();

}

在项目开发中，关于focusNode的常用方法代码如下：

//获取焦点

void getFocusFunction(BuildContext context){

FocusScope.of(context).requestFocus(focusNode);

}

//失去焦点

void unFocusFunction(){

focusNode.unfocus();

}

//隐藏键盘而不丢失文本字段焦点：

void hideKeyBoard(){

SystemChannels.textInput.invokeMethod('TextInput.hide');

}

在实际项目中的一个用户操作习惯就是当输入键盘是弹出状态时，用户点击屏幕的空白处，键盘要隐藏，处理实现思路就是在MaterialApp组件中的第一个根布局设置一上手势兼听，然后在手势兼听中处理隐藏键盘的功能，代码如下：

/// 全局点击空白处理隐藏键盘

Widget buildMainBody(BuildContext context) {

return GestureDetector(

onTap: () {

//隐藏键盘

SystemChannels.textInput.invokeMethod('TextInput.hide');

},

child: ... ... 省略

);

}

完毕