[Flutter]实现：点击TextField外部区域后让TextField失去焦点

概念

具体的想法就是TextField的FocusNode获得焦点后，添加一个Overlay，全屏监听OnPointerDown事件，如果事件坐标在Widget的范围外就调用FocusNode的unfocus()并且删除Overlay。

实现这个想法后，经过测试发现适应力极强，因此提交到pub.dev了，名字叫focus_widget。

两种使用方法，很简单

class XXX extend StatelessWidget{
    final FocusNode _input = FocusNode();
    @override
    Widget build(BuildContext context) {
        return Scaffold(
        body: Column(children:[
            FocusWidget(
                focusNode:_input,
                child: TextField(
                    focusNode:_input,
                    InputDecoration(hintText: 'Input 1', labelText: 'Input 1'),
                )
            ),
            FocusWidget.builder(
                context,
                (ctx, focusNode) => TextField(
                  focusNode: focusNode,
                  autofocus: true,
                  decoration: InputDecoration(
                    hintText: 'Input 2',
                    labelText: 'Input 2',
                  ),
                ),
              )
        ]));
    }
}

录屏