keyboard_focus_manager 0.9.2 icon indicating copy to clipboard operation
keyboard_focus_manager: ^0.9.2 copied to clipboard

Package for displaying pane over keyboard, especially useful for closing keyboard using FocusScope.

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..

Usage #

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.

  @override
  void initState() {
    super.initState();
    _closeKeyboardOverlay.listenKeyboardVisibility(
      context,
      // OPTIONAL
      closeButtonLabel: 'CLOSE',
      closeButtonLabelStyle: TextStyle(fontSize: 15.0),
    );
  }

  @override
  void dispose() {
    _closeKeyboardOverlay.removeKeyboardVisibilityListener();
    super.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.

  @override
  Widget build(BuildContext context) {
    return KeyboardUnfocusArea(
      child: Scaffold(
        body: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 20.0),
          child: Column(
            children: [
              TextField(
                decoration: InputDecoration(
                  hintText: 'Ordinary TextField',
                  border: OutlineInputBorder(),
                ),
              ),
              SizedBox(height: 20.0),
              Text(
                'Keyboard will be closed when tapped anywhere outside the TextField.',
                textAlign: TextAlign.center,
                style: TextStyle(fontSize: 16.0),
              ),
            ],
          ),
        ),
      ),
    );
  }
0
likes
80
pub points
0%
popularity

Publisher

unverified uploader

Package for displaying pane over keyboard, especially useful for closing keyboard using FocusScope.

Documentation

API reference

License

Icon for licenses.MIT (LICENSE)

Dependencies

flutter, keyboard_visibility

More

Packages that depend on keyboard_focus_manager