Package offering 2 specific solutions to close/unfocus keyboard when it is on focus of TextField by:

  • Touch outside of anywhere but TextField (KeyboardUnfocusArea())
  • Display close button over keyboard (CloseKeyboardOverlay())

Getting Started

This is a package I developed after searching a solution for this specific issue, wandering around various flutter packages, solutions and I use it on all of my production projects without an exception. So, I decided to make it available among all flutter developers.

Use, modify, clone, make pull requests..


Keyboard close button overlay

Create an instance of CloseKeyboardOverlay() class on your state class.

 final _closeKeyboardOverlay = CloseKeyboardOverlay();

Instantiate listener on initState() of your state class and do not forget to remove/dispose listener on dispose() method.

  void initState() {
      // OPTIONAL
      closeButtonLabel: 'CLOSE',
      closeButtonLabelStyle: TextStyle(fontSize: 15.0),

  void dispose() {

The rest will be handled 😎

Keyboard unfocus area

The widget and its descendant widgets that you wrap with KeyboardUnfocusArea() will have a functionality that when anywhere but TextField() is touched the keyboard will be closed/unfocused.

  Widget build(BuildContext context) {
    return KeyboardUnfocusArea(
      child: Scaffold(
        body: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 20.0),
          child: Column(
            children: [
                decoration: InputDecoration(
                  hintText: 'Ordinary TextField',
                  border: OutlineInputBorder(),
              SizedBox(height: 20.0),
                'Keyboard will be closed when tapped anywhere outside the TextField.',
                style: TextStyle(fontSize: 16.0),