# kirillzyusko/react-native-keyboard-controller

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/kirillzyusko-react-native-keyboard-controller).**

3,349 stars · 138 forks · TypeScript · mit

## Links

- GitHub: https://github.com/kirillzyusko/react-native-keyboard-controller
- Homepage: https://kirillzyusko.github.io/react-native-keyboard-controller/
- awesome-repositories: https://awesome-repositories.com/repository/kirillzyusko-react-native-keyboard-controller.md

## Topics

`android` `animation` `avoiding-view` `chat` `extend-keyboard` `focused-input` `interactive` `ios` `keyboard` `keyboard-background-view` `keyboard-toolbar` `over-keyboard-view` `react-native`

## Description

This is a keyboard interaction library and manager for React Native that provides smooth animations, gesture-based dismissal, and event tracking. It serves as a cross-platform keyboard event bus, ensuring consistent keyboard show and hide behavior between iOS and Android.

The project features an interactive animation driver that links native keyboard frame events directly to animated values to bypass bridge round-trips. It enables interactive keyboard dismissal via swipe gestures and includes a keyboard preloading system to eliminate first-show latency and input lag.

The library provides components for building keyboard-aware scroll views and chat interfaces that automatically adjust content insets to keep active inputs visible. It also includes a native overlay layer for rendering toolbars or suggestion views directly above the keyboard without dismissing the soft input.

The project is implemented in TypeScript.

## Tags

### User Interface & Experience

- [React Native UI Libraries](https://awesome-repositories.com/f/user-interface-experience/component-utilities/ui-frameworks/component-libraries/ecosystem-specific-libraries/react-native-ui-libraries.md) — Provides a comprehensive set of UI components and tools for managing keyboard interactions in React Native.
- [Keyboard Management](https://awesome-repositories.com/f/user-interface-experience/keyboard-management.md) — Offers a comprehensive suite for managing keyboard animations, swipe dismissal, and layout adjustments in React Native. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Keyboard Accessory Toolbars](https://awesome-repositories.com/f/user-interface-experience/action-toolbars/toolbar-button-customizations/keyboard-accessory-toolbars.md) — Implements a native overlay layer to mount custom toolbars and suggestion views directly above the virtual keyboard.
- [Native-to-Animated Value Drivers](https://awesome-repositories.com/f/user-interface-experience/animation-and-motion-systems/physics-motion-dynamics/physics-based-animations/interactive-animation-systems/native-to-animated-value-drivers.md) — Bypasses bridge round-trips by linking native keyboard frame events directly to animated values.
- [Native Thread Animation Engines](https://awesome-repositories.com/f/user-interface-experience/animation-optimization-tools/animation-performance-optimizers/native-thread-animation-engines.md) — Links native keyboard frame events directly to animated values on the native thread to ensure jank-free transitions.
- [Gesture-Based Dismissal](https://awesome-repositories.com/f/user-interface-experience/drawers/gesture-based-dismissal.md) — Enables the keyboard to be dismissed using smooth native swipe gestures.
- [Keyboard Swipe Dismissals](https://awesome-repositories.com/f/user-interface-experience/drawers/gesture-based-dismissal/keyboard-swipe-dismissals.md) — Implements interactive keyboard dismissal via downward swipe gestures for a fluid user experience. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Interactive Dismissal](https://awesome-repositories.com/f/user-interface-experience/gesture-interaction-frameworks/interactive-dismissal.md) — Intercepts native swipe gestures to drive the keyboard closing animation in real time.
- [Keyboard Accessory Components](https://awesome-repositories.com/f/user-interface-experience/keyboard-accessory-components.md) — Renders custom toolbars and suggestion views in a native overlay layer directly above the keyboard. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Keyboard-Driven UI Animations](https://awesome-repositories.com/f/user-interface-experience/keyboard-driven-ui-animations.md) — Links keyboard position changes to animated values to make UI elements move smoothly. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Keyboard Event Handlers](https://awesome-repositories.com/f/user-interface-experience/keyboard-event-handlers.md) — Ensures consistent keyboard show and hide event handling across different mobile platforms. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Frame Event Streams](https://awesome-repositories.com/f/user-interface-experience/keyboard-event-handlers/frame-event-streams.md) — Broadcasts real-time keyboard position and dimension changes as continuous event streams to JavaScript.
- [Keyboard Overlay Windows](https://awesome-repositories.com/f/user-interface-experience/keyboard-overlay-windows.md) — Attaches a native view layer above the keyboard to render toolbars without dismissing the soft input.
- [Native Animation Drivers](https://awesome-repositories.com/f/user-interface-experience/native-animation-drivers.md) — Implements an animation driver that links native keyboard events directly to animated values to bypass bridge round-trips.
- [Native Event Streams](https://awesome-repositories.com/f/user-interface-experience/native-event-streams.md) — Streams real-time keyboard frame and dimension changes from native platform listeners to JavaScript subscribers.
- [Keyboard-Aware Scroll Alignment](https://awesome-repositories.com/f/user-interface-experience/navigation-scrolling-tools/keyboard-driven-scroll-alignment/keyboard-aware-scroll-alignment.md) — Automatically adjusts scroll view content insets and scroll position to keep active inputs visible.
- [Keyboard-Linked Animations](https://awesome-repositories.com/f/user-interface-experience/ui-animations/smooth-animation-interfaces/keyboard-linked-animations.md) — Links native keyboard frame events directly to animated values for fluid UI transitions.
- [Mobile Messaging Interfaces](https://awesome-repositories.com/f/user-interface-experience/chat-interfaces/mobile-messaging-interfaces.md) — Provides optimized scroll view and layout logic for building mobile chat interfaces with keyboard avoidance.
- [Chat Message List Renderers](https://awesome-repositories.com/f/user-interface-experience/chat-message-utilities/chat-message-list-renderers.md) — Provides scroll views optimized for message lists that automatically handle keyboard avoidance. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Input Geometry Tracking](https://awesome-repositories.com/f/user-interface-experience/input-geometry-tracking.md) — Exposes the bounding rectangle of focused text inputs for custom layout calculations and offsets. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Keyboard-Relative Positioning](https://awesome-repositories.com/f/user-interface-experience/keyboard-relative-positioning.md) — Allows views to stick to or avoid the keyboard while matching the background color of the input area. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Chat Interface Components](https://awesome-repositories.com/f/user-interface-experience/prebuilt-ui-components/chat-interface-components.md) — Facilitates the creation of messaging layouts using scroll views optimized for keyboard interactions. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Swipe-to-Dismiss Gestures](https://awesome-repositories.com/f/user-interface-experience/toast-notifications/swipe-to-dismiss-gestures.md) — Supports interactive keyboard dismissal via swipe gestures for a more fluid mobile interaction.

### Part of an Awesome List

- [Keyboard Occlusion Prevention](https://awesome-repositories.com/f/awesome-lists/devtools/keyboard-input/keyboard-occlusion-prevention.md) — Automatically adjusts scroll view content insets to keep active text inputs visible when the keyboard appears. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Keyboard-Aware Scroll Views](https://awesome-repositories.com/f/awesome-lists/devtools/keyboard-input/keyboard-occlusion-prevention/keyboard-aware-scroll-views.md) — Implements a scroll view that automatically adjusts its content and insets to keep active text inputs visible.
- [Keyboard Movement Animations](https://awesome-repositories.com/f/awesome-lists/media/animation-transitions/ui-transition-animations/keyboard-movement-animations.md) — Links native keyboard position events directly to animated values to ensure smooth UI transitions. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Keyboard Synchronized Transitions](https://awesome-repositories.com/f/awesome-lists/media/animation-transitions/ui-transition-animations/keyboard-synchronized-transitions.md) — Synchronizes UI elements with keyboard movement and interactive dismissal for seamless transitions. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Keyboard Preloading](https://awesome-repositories.com/f/awesome-lists/devtools/keyboard-input/keyboard-preloading.md) — Initializes the keyboard before a user taps an input field to remove initial lag. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))

### Content Management & Publishing

- [Keyboard Accessory Overlays](https://awesome-repositories.com/f/content-management-publishing/media-management/subtitle-management-systems/subtitle-rendering-layers/custom-overlay-layers/keyboard-accessory-overlays.md) — Renders a view above the keyboard by attaching a native overlay window that tracks keyboard frame updates.

### Mobile Development

- [Android Keyboard Event Tracking](https://awesome-repositories.com/f/mobile-development/android-keyboard-event-tracking.md) — Provides consistent keyboard visibility event tracking on Android to match iOS behavior. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Event Parity Layers](https://awesome-repositories.com/f/mobile-development/android-virtual-keyboards/event-parity-layers.md) — Ensures keyboard show and hide events fire consistently on Android to match iOS behavior.
- [Keyboard-Aware UI Management](https://awesome-repositories.com/f/mobile-development/keyboard-aware-ui-management.md) — Provides a specialized scroll view for React Native that prevents keyboard occlusion by automatically adjusting the viewport. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Focus Latency Reduction](https://awesome-repositories.com/f/mobile-development/input-field-navigation/input-focus-ux/focus-latency-reduction.md) — Eliminates first-show latency and input lag by preloading keyboard initialization.
- [Geometry Tracking](https://awesome-repositories.com/f/mobile-development/input-field-navigation/input-focus-ux/geometry-tracking.md) — Exposes the bounding rectangle of the focused text input for custom layout calculations and offset adjustments.
- [Keyboard Initialization Optimizations](https://awesome-repositories.com/f/mobile-development/keyboard-initialization-optimizations.md) — Eliminates first-show latency and input lag by preloading the keyboard during initialization. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))
- [Keyboard Latency Optimizations](https://awesome-repositories.com/f/mobile-development/keyboard-latency-optimizations.md) — Eliminates first-show latency by programmatically requesting input focus on a hidden field during initialization.

### Artificial Intelligence & ML

- [UI Bounding Box Tracking](https://awesome-repositories.com/f/artificial-intelligence-ml/bounding-box-regression/bounding-box-representations/ui-bounding-box-tracking.md) — Retrieves the native rectangle of the active text field for custom layout and offset adjustments.

### Data & Databases

- [Keyboard Asset Preloading](https://awesome-repositories.com/f/data-databases/data-feeds/asset-preloading/mobile-asset-preloaders/keyboard-asset-preloading.md) — Prevents delays when opening the interface for the first time by loading keyboard assets immediately upon mounting. ([source](https://cdn.jsdelivr.net/gh/kirillzyusko/react-native-keyboard-controller@main/README.md))

### Operating Systems & Systems Programming

- [Keyboard Input Modes](https://awesome-repositories.com/f/operating-systems-systems-programming/keyboard-input-modes.md) — Provides the ability to toggle between resize and pan window modes on Android at runtime.

### Programming Languages & Runtimes

- [Keyboard Initialization](https://awesome-repositories.com/f/programming-languages-runtimes/dynamic-class-creation/class-loading-mechanisms/preloading/keyboard-initialization.md) — Removes first-time focus lag by preloading the keyboard before the user interacts with an input field.