{"id":25350897,"url":"https://github.com/vincevargadev/keyboard_hider_flutter","last_synced_at":"2026-01-11T04:47:48.704Z","repository":{"id":61973901,"uuid":"450844595","full_name":"vincevargadev/keyboard_hider_flutter","owner":"vincevargadev","description":"This tiny Flutter package help you hide the keyboard. With convenient helper methods and the KeyboardHider widget.","archived":false,"fork":false,"pushed_at":"2022-01-22T21:37:35.000Z","size":1321,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-02-14T17:18:54.425Z","etag":null,"topics":["dart","dart-package","flutter","flutter-package","flutter-ui","flutter-widget","flutter-widgets","hide-your-keyboard"],"latest_commit_sha":null,"homepage":"https://pub.dev/packages/keyboard_hider","language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-3-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vincevargadev.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-01-22T14:44:25.000Z","updated_at":"2025-01-22T12:45:51.000Z","dependencies_parsed_at":"2022-10-24T13:30:45.063Z","dependency_job_id":null,"html_url":"https://github.com/vincevargadev/keyboard_hider_flutter","commit_stats":null,"previous_names":["vincevargadev/keyboard_hider_flutter","dartsidedev/keyboard_hider"],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vincevargadev%2Fkeyboard_hider_flutter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vincevargadev%2Fkeyboard_hider_flutter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vincevargadev%2Fkeyboard_hider_flutter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vincevargadev%2Fkeyboard_hider_flutter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vincevargadev","download_url":"https://codeload.github.com/vincevargadev/keyboard_hider_flutter/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247934808,"owners_count":21020724,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dart","dart-package","flutter","flutter-package","flutter-ui","flutter-widget","flutter-widgets","hide-your-keyboard"],"created_at":"2025-02-14T17:18:52.624Z","updated_at":"2026-01-11T04:47:48.035Z","avatar_url":"https://github.com/vincevargadev.png","language":"Dart","funding_links":[],"categories":[],"sub_categories":[],"readme":"# `keyboard_hider`\n\n\u003e This tiny Flutter package help you hide the keyboard. With convenient helper methods and the `KeyboardHider` widget.\n\nHave you ever heard that in Flutter, everything is a widget? I have, so I decided to create a simple widget that helps you hide your users' keyboard easily on your forms. \n\n[![Continuous Integration](https://github.com/dartsidedev/keyboard_hider/workflows/Continuous%20Integration/badge.svg?branch=main)](https://github.com/dartsidedev/keyboard_hider/actions) [![codecov](https://codecov.io/gh/dartsidedev/keyboard_hider/branch/main/graph/badge.svg)](https://codecov.io/gh/dartsidedev/keyboard_hider) [![keyboard_hider](https://img.shields.io/pub/v/keyboard_hider?label=keyboard_hider\u0026logo=dart)](https://pub.dev/packages/keyboard_hider 'See keyboard_hider package info on pub.dev') [![Published by dartside.dev](https://img.shields.io/static/v1?label=Published%20by\u0026message=dartside.dev\u0026logo=dart\u0026logoWidth=30\u0026color=40C4FF\u0026labelColor=1d599b\u0026labelWidth=100)](https://pub.dev/publishers/dartside.dev/packages) [![GitHub Stars Count](https://img.shields.io/github/stars/dartsidedev/keyboard_hider?logo=github)](https://github.com/dartsidedev/keyboard_hider 'Star me on GitHub!')\n\n## Important links\n\n* [Read the source code and **star the repo** on GitHub](https://github.com/dartsidedev/keyboard_hider)\n* [Open an issue on GitHub](https://github.com/dartsidedev/keyboard_hider/issues)\n* [See package on **pub.dev**](https://pub.dev/packages/keyboard_hider)\n* [Read the docs on **pub.dev**](https://pub.dev/documentation/keyboard_hider/latest/)\n* [Stack Overflow - How can I dismiss the on screen keyboard?](https://stackoverflow.com/questions/44991968/how-can-i-dismiss-the-on-screen-keyboard)\n* Flutter Docs - [`GestureDetector`](https://api.flutter.dev/flutter/widgets/GestureDetector-class.html), [`SystemChannels`](https://api.flutter.dev/flutter/services/SystemChannels-class.html), [`SystemChannels.textInput`](https://api.flutter.dev/flutter/services/SystemChannels/textInput-constant.html), [`FocusScopeNode`](https://api.flutter.dev/flutter/widgets/FocusScopeNode-class.html), [`FocusNode.unfocus`](https://api.flutter.dev/flutter/widgets/FocusNode/unfocus.html)\n\nIf you enjoy using this package, **a thumbs up on [pub.dev](https://pub.dev/packages/keyboard_hider) would be highly appreciated!** 👍💙🚀\n\n\u003cimg src=\"https://github.com/dartsidedev/keyboard_hider/blob/main/doc_assets/example_app.gif?raw=true\" alt=\"Flutter package keyboard_hider example app in action\" height=\"750\"/\u003e\n\n## Motivation\n\nWhile interacting with our users, we realized that not every user knows their keyboard very well and that they expect the keyboard to be hidden when the click outside a text field.\nWe decided to give our users the option to hide their keyboard for forms when they clicked outside a text field.\n\nI searched how to do that, and I found [this question](https://stackoverflow.com/questions/44991968/how-can-i-dismiss-the-on-screen-keyboard) on Stack Overflow.\nI wasn't really satisfied with adding repeated code everywhere, as remembering how to configure the `GestureDetector`, and what is the correct way to `unfocus` (hide the keyboard) is a little annoying.\n\nYou can see [my answer on Stack Overflow](https://stackoverflow.com/a/55727378/4541492) from 2019: I decided to wrap this functionality in a convenient Flutter widget that simplifies hiding the keyboard whenever the user taps on the screen outside a text field (similar to how keyboard hiding works on the web).\n\nSince then, I worked on a couple of projects, and I've seen that this pattern is discussed again and again, so now I decided to publish this package so that I (and everyone else) can quickly and simply add this functionality to our Flutter apps.\n\n## Usage\n\nWrap your widget that should detect touches with a [`KeyboardHider` widget](https://pub.dev/documentation/keyboard_hider/latest/keyboard_hider/KeyboardHider-class.html) and upon touch, it should hide the keyboard if visible.\n\nThe widget doesn't interfere with text fields, so your users can seamlessly switch and jump between text fields, even if the text fields are wrapped in a `KeyboardHider` widget.\n\n```dart\nimport 'package:keyboard_hider/keyboard_hider.dart';\n\nclass YourWidget extends StatelessWidget {\n  @override\n  Widget build(BuildContext context) {\n    // When you now tap on the child, the keyboard should be dismissed.\n    return KeyboardHider(\n      child: Text('your widgets...'),\n    );\n  }\n}\n```\n\nThe package also includes two helper functions that simplified hiding your keyboard.\n\nThe [`unfocus(BuildContext context)`](https://pub.dev/documentation/keyboard_hider/latest/keyboard_hider/unfocus.html) function takes the context and dismisses the keyboard by un-focusing the context's `FocusScopeNode`.\n\nThe [`hideTextInput()` function](https://pub.dev/documentation/keyboard_hider/latest/keyboard_hider/hideTextInput.html) invokes the `TextInput.hide` method on the `SystemChannels.textInput` method channel.\n\nIf needed, you can also pass a [`HideMode`](https://pub.dev/documentation/keyboard_hider/latest/keyboard_hider/HideMode.html) value to the `KeyboardHider`.\nBy default, the `KeyboardHider` widget uses the `unfocus` approach, but you can change that to `hideTextInput`:\n\n```dart\nclass YourOtherWidget extends StatelessWidget {\n  @override\n  Widget build(BuildContext context) {\n    // When you now tap on the child, the keyboard should be hidden.\n    return KeyboardHider(\n      mode: HideMode.hideTextInput,\n      child: Text('your widgets...'),\n    );\n  }\n}\n```\n\nWith `hideTextInput`, the keyboard will be hidden, but it does not unfocus the current focus scope node.\nThis means that if a text field was in focus, it will stay in focus, only the keyboard will get hidden.\n\nYou can find the example app on [GitHub](https://github.com/dartsidedev/keyboard_hider/blob/main/example/lib/main.dart) and on [pub.dev](https://pub.dev/packages/keyboard_hider/example).\n\nIf you still have questions about the structure of this package, I encourage you to take another look at the [docs](https://pub.dev/documentation/keyboard_hider/latest/).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvincevargadev%2Fkeyboard_hider_flutter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvincevargadev%2Fkeyboard_hider_flutter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvincevargadev%2Fkeyboard_hider_flutter/lists"}