How can I dismiss the on screen keyboard?
Solution 1
Note: This answer is outdated. See the answer for newer versions of Flutter.
You can dismiss the keyboard by taking away the focus of the TextFormField
and giving it to an unused FocusNode
:
FocusScope.of(context).requestFocus(FocusNode());
Solution 2
For Flutter version 2 or latest :
Since Flutter 2
with null safety this is the best way:
FocusManager.instance.primaryFocus?.unfocus();
Note: using old ways leads to some problems like keep rebuild states;
For Flutter version < 2 :
As of Flutter v1.7.8+hotfix.2, the way to go is:
FocusScope.of(context).unfocus();
Comment on PR about that:
Now that #31909 (be75fb3) has landed, you should use
FocusScope.of(context).unfocus()
instead ofFocusScope.of(context).requestFocus(FocusNode())
, sinceFocusNode
s areChangeNotifiers
, and should be disposed properly.
-> DO NOT use ̶r̶e̶q̶u̶e̶s̶t̶F̶o̶c̶u̶s̶(̶F̶o̶c̶u̶s̶N̶o̶d̶e̶(̶)̶
anymore.
F̶o̶c̶u̶s̶S̶c̶o̶p̶e̶.̶o̶f̶(̶c̶o̶n̶t̶e̶x̶t̶)̶.̶r̶e̶q̶u̶e̶s̶t̶F̶o̶c̶u̶s̶(̶F̶o̶c̶u̶s̶N̶o̶d̶e̶(̶)̶)̶;̶
Read more about the FocusScope
class in the flutter docs.
Solution 3
Solution with FocusScope doesn't work for me. I found another:
import 'package:flutter/services.dart';
SystemChannels.textInput.invokeMethod('TextInput.hide');
It solved my problem.
Solution 4
For Flutter 1.17.3 (stable channel as of June 2020), use
FocusManager.instance.primaryFocus.unfocus();
Solution 5
Following code helped me to hide keyboard
void initState() {
SystemChannels.textInput.invokeMethod('TextInput.hide');
super.initState();
}
Comments
-
Collin Jackson over 2 years
I am collecting user input with a
TextFormField
and when the user presses aFloatingActionButton
indicating they are done, I want to dismiss the on screen keyboard.How do I make the keyboard go away automatically?
import 'package:flutter/material.dart'; class MyHomePage extends StatefulWidget { MyHomePageState createState() => new MyHomePageState(); } class MyHomePageState extends State<MyHomePage> { TextEditingController _controller = new TextEditingController(); @override Widget build(BuildContext context) { return new Scaffold( appBar: new AppBar(), floatingActionButton: new FloatingActionButton( child: new Icon(Icons.send), onPressed: () { setState(() { // send message // dismiss on screen keyboard here _controller.clear(); }); }, ), body: new Container( alignment: FractionalOffset.center, padding: new EdgeInsets.all(20.0), child: new TextFormField( controller: _controller, decoration: new InputDecoration(labelText: 'Example Text'), ), ), ); } } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return new MaterialApp( home: new MyHomePage(), ); } } void main() { runApp(new MyApp()); }