FlutterでTextFieldのフォーカスを外す方法

Fluttter で起こる現象で、TextField にフォーカスした後に TextField 以外をタップしてもフォーカスが外れません。

そのためソフトウェアキーボードが出たままの状態になり、操作性が悪くなります。

すべての状況でフォーカスを外す

return GestureDetector(
  onTap: () => FocusManager.instance.primaryFocus?.unfocus(),
  child: Scaffold(
    body: Center(child: TextField()),
  ),
);

FocusScopeよりもFocusManagerを使った方が確実です。

Flutter で TextField のフォーカスを外す

以前紹介していた方法ですが、Drawerを表示して戻るとフォーカスが復帰するケースがありますので推奨しません。

return Scaffold(
  body: GestureDetector(
    onTap() {
      FocusScope.of(context).unfocus();
    },
    child: TextField(),
  ),
);

どちらもGestureDetectorで対象の TextField ウィジェットをラップした状態にすることで任意の場所をタップするだけでフォーカスを外すことができます。