单击TextField /屏幕外的任何地方后，如何在颤动时隐藏软输入键盘？

Question

目前我知道使用此代码隐藏软键盘的方法，通过任何小部件的onTap方法。

FocusScope.of(context).requestFocus(new FocusNode());

但我想通过单击TextField外部或屏幕上的任何位置来隐藏软键盘。有没有什么方法可以做到这一点？

Answer 1

你是以错误的方式做到这一点，只需尝试这种简单的方法来隐藏软键盘。你只需要在GestureDetector方法中包装整个屏幕，onTap方法就可以编写这段代码。

        FocusScope.of(context).requestFocus(new FocusNode());

这是完整的例子：

new Scaffold(

body: new GestureDetector(
  onTap: () {

    FocusScope.of(context).requestFocus(new FocusNode());
  },
child: new Container(
   //rest of your code write here
    )
 )

Answer 2

将整个屏幕包裹在GestureDetector中

new Scaffold(

  body: new GestureDetector(
      onTap: () {
        // call this method here to hide soft keyboard
        FocusScope.of(context).requestFocus(new FocusNode());
      },
    child: new Container(
       -
       -
       -
        )
   )

Answer 3

Updated

从2019年5月初开始，FocusNode现在有unfocus方法：

取消任何未完成的焦点请求。

无论此节点是否曾请求焦点，此方法都可以安全地调用。

如果您声明unfocus以编程方式聚焦文本字段，请使用FocusNode：

final focusNode = FocusNode();

// ...

focusNode.unfocus();

我的原始答案建议使用detach方法 - 只有当你需要完全摆脱你的FocusNode时才使用它。如果你打算保留它 - 使用unfocus代替。

如果您没有专门声明FocusNode - 使用“常规”方法：

FocusScope.of(context).requestFocus(new FocusNode());

Original Answer

我看到每个人都使用FocusScope.of(context).requestFocus(new FocusNode());来取消对焦文本字段，这对我来说似乎不对。

IMO它只会创建新的无用对象，直到用户点击“真实”FocusNode文本字段。

如果你正在寻找一种'正确'的方法1）解雇键盘2）无法聚焦文本字段 - 我可能找到了正确的方法：

FocusScope.of(context).detach();

Official docs说，即使没有关注节点，detach也可以安全使用。

---

However, if you'd like to only hide the keyboard without loosing text field focus (for some reason) - you can try this:

import 'package:flutter/services.dart' show SystemChannels;

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

Answer 4

我添加了这一行

behavior: HitTestBehavior.opaque,

到了GestureDetector，它似乎正在按预期工作。

 @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(AppLocalizations.of(context).calculatorAdvancedStageTitle),
      ),
      body: GestureDetector(
        behavior: HitTestBehavior.opaque,
        onTap: () {
          FocusScope.of(context).requestFocus(new FocusNode());
        },
        child: Padding(
          padding: const EdgeInsets.only(
            left: 14,
            top: 8,
            right: 14,
            bottom: 8,
          ),
          child: Text('Work'),
        ),
      )
    );
  }

Answer 5

GestureDetector(
  onTap: () {
        FocusScope.of(context).requestFocus(FocusNode());
  },
  behavior: HitTestBehavior.translucent,
  child: rootWidget
)

Answer 6

从Flutters最新版本v1.7.8 + hotfix.2开始，您可以使用unfocus（）而不是requestfocus（）隐藏键盘

FocusScope.of(context).unfocus()

因此，无论何时点击身体部位键盘都会被隐藏

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text("Login"),
      ),
      body: GestureDetector(
        onTap: () {
          FocusScope.of(context).unfocus();
        },
        child: Container(...)
      ),
    );
  }