Question

我有一个Statefull小部件，其中包含一个文本字段。我想知道用户何时在文本字段外单击。为了做到这一点，我正在使用FocusNode。现在的问题是，当用户在texfield之外单击时，不会调用我的回调。这是我的代码

class TestText extends State<SingleFieldEdit> 
{
    TextEditingController _qTextEditController = new TextEditingController();
    FocusNode _focus;

    TestText();

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

    @override
    void dispose() {
        super.dispose();
        _focus.dispose();
    }

    void _onFocusChange(){
        print("Focus changed - Does not get called when clicked outside of textbox");
        if(_focus.hasFocus==false){
            setState(() {
                _enableEdit=false;
                _qTextEditController.text = _existingText;
            });

        }
    }


    Widget getEditableField()
    {
        Widget containerBorder =  new Container(
                margin: const EdgeInsets.all(0.0),
                padding: const EdgeInsets.only(top:0.0,bottom:0.0),
                decoration: new BoxDecoration(
                    border: new Border(top:BorderSide(width: 0.4),bottom: BorderSide(width: 0.4) ),
                    ),
                child: new Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: <Widget>[
                 new Flexible(child:TextField(
                        focusNode: _focus,
                        controller: _qTextEditController,
                        decoration: InputDecoration.collapsed(hintText: 'Your hint goes here',enabled: _enableEdit),//InputDecoration(hintText: 'Your hint goes here', /*labelText: "Your Label goes here",*/ enabled: _enableEdit),
                        )),
                    getIcon(),
                    ],)
                );

        return getEditableField
    }

    @override
    Widget build(BuildContext context)
    {
        return getEditableField();
    }

}

Answer 1

用GestureDetector包裹脚手架，并将onTap设置为“专注于另一个节点”

Answer 2

您需要关注另一个FocusNode
或在重点关注的unfocus（https://github.com/flutter/flutter/issues/19552#issuecomment-410909751）上致电FocusNode

请关注https://github.com/flutter/flutter/issues/20227并对其进行投票，以寻求更简单的解决方案（也许也https://github.com/flutter/flutter/issues/7247）。

Flutter：在TextField之外单击时，不会调用具有FocusNode的TextField

2 个答案: