While developing the Flutter project, it was inevitable to deal with the device’s keyboard. The Android keyboard is fine, but the iOS keyboard can sometimes surprise you.

The most effective way to do this is to mix your TextField component with the WidgetsBindingObserver class, which handles the keyboard expansion and recall logic in its expand method.

class YourTextFieldState extends State<YourTextFieldState> with WidgetsBindingObserver { @override void initState() { super.initState(); / / / initializes the WidgetsBinding. Instance. AddObserver (this); } @override void didChangeMetrics() { super.didChangeMetrics(); WidgetsBinding.instance.addPostFrameCallback((_) { setState(() { if(MediaQuery.of(context).viewInsets.bottom==0){ /// }else{/// keyboard popup}}); }); } @override void dispose() {/// dispose(); WidgetsBinding.instance.removeObserver(this); }}Copy the code

If your input component is something like a timer, it’s possible that every 1 second countdown your current component’s page will have to render again, which may not be able to turn off the soft keyboard on iOS devices. Take the component out of focus by adding the following code to the keyboard recall logic:

focusNode.unfocus();
Copy the code

FocusNode is the focusNode instantiation object in your current component class, or add global code:

FocusScope.of(context).requestFocus(FocusNode());
Copy the code

The above content modified after the completion of more tests, I hope to help you ~