1.1.0 • Published 2 years ago

@rnhooks/keyboard v1.1.0

Weekly downloads
773
License
MIT
Repository
github
Last release
2 years ago

@rnhooks/keyboard Build Status Maintainability

React Native hook for keyboard

Installation

yarn add @rnhooks/keyboard

Note

v1.0.0 and above is only supported on react-native >= 0.65, for older react-native use the older release.

Usage

import useKeyboard from '@rnhooks/keyboard';

function App() {
  const [visible, dismiss] = useKeyboard();

  return (
    <View style={styles.container}>
      <Text style={styles.welcome}>@rnhook/keyboard</Text>
      <Text style={styles.instructions}>{visible ? 'Keyboard Visible' : 'Keyboard Not Visible'}</Text>
      <Button title="Dismiss Keyboard" onPress={dismiss} />
    </View>
  );
}

Configuration

If you like, you can configure the hook to use the will events instead of the did events (by default, it uses the did events). This is useful in cases where you want to trigger an animation before the keyboard begins dismissing:

useKeyboard({
  useWillShow: true,
  useWillHide: true,
})
NameDefaultTypeDescription
useWillShowfalsebooleanUse the keyboardWillShow event instead.
useWillHidefalsebooleanUse the keyboardWillHide event instead.

Output

NameDefaultTypeDescription
visiblefalsebooleanKeyboard Visibility
dismissKeyboard.dismissfunctionDismiss Keyboard