react-native-keyboard-state-provider
v1.0.1
Published
Keyboard state provider (visible/invisible) for react-native.
Downloads
23
Maintainers
Readme
React Native Keyboard State Provider
Keyboard state provider (visible/invisible) for react-native.
Installation
yarn add react-native-keyboard-state-provider
# or
npm install react-native-keyboard-state-provider
Usage
First add the provider to your App.tsx
import { KeyboardStateProvider } from 'react-native-keyboard-state-provider';
...
export default function App() {
return (
<KeyboardStateProvider>
<Screen />
</KeyboardStateProvider>
);
}
Then you can request the keyboard state everywhere from within your app
import { useKeyboardState } from 'react-native-keyboard-state-provider';
...
function Screen() {
const { keyboardVisible } = useKeyboardState();
return (
<Text>Keyboard visible: {keyboardVisible}</Text>
);
}
keyboardVisible is a boolean with value true if the keyboard is visible/open and false if it is not visible. The value gets updated whenever the keyboard state changes.
Usage with react-native-web / expo
It works with expo and also on the web without any errors. But as there is no software keyboard on desktop browsers the value keyboardVisible will always be false.
Contributing
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.