1.0.7 • Published 4 years ago
smiledev-react-native-on-screen-keyboard v1.0.7
React Native On-screen Keyboard
Installation
npm i @junctiontv/react-native-on-screen-keyboard
Usage
import Keyboard from "@junctiontv/react-native-on-screen-keyboard";
...
<Keyboard
title={title}
textInput={textInputRef}
onInput={this.handleInput}
inputType={inputType}
keyboardContainerStyle={styles.keyboardContainer}
keyboardTitleStyle={styles.keyboardTitle}
keyboardButtonContainerStyle={styles.keyboardButtonContainer}
keyboardButtonTextStyle={styles.keyboardButtonText}
keyboardButtonTextPressStyle={styles.keyboardButtonTextPress}
keyboardButtonStyle={styles.keyboardButton}
keyboardButtonPressStyle={styles.keyboardButtonPress}
keyboardButtonWidthMultiplier={{ "2": 2.05, "3": 3.1, "4": 4.15 }}
/>| Prop | Type | Optional | Description |
|---|---|---|---|
title | String | :heavy_check_mark: | sets the title of the keyboard |
textInput | React Ref | :x: | the reference of the TextInput which is to be attached |
onInput | Function | :x: | callback to set the value of the text from the keyboard |
inputType | String | :x: | sets the input type of the keyboard. Currently only textEmailAddress, textPassword and textSearch are supported |
keyboardContainerStyle | Object | :heavy_check_mark: | style to set the style for the keyboard container |
keyboardTitleStyle | Object | :heavy_check_mark: | style to set the style for the keyboard title |
keyboardButtonContainerStyle | Object | :heavy_check_mark: | style to set the style for the keyboard buttons container |
keyboardButtonTextStyle | Object | :heavy_check_mark: | style to set the style for the keyboard buttons text in unpressed state |
keyboardButtonTextPressStyle | Object | :heavy_check_mark: | style to set the style for the keyboard buttons text in pressed state |
keyboardButtonStyle | Object | :heavy_check_mark: | style to set the style for the keyboard buttons in unpressed state |
keyboardButtonPressStyle | Object | :heavy_check_mark: | style to set the style for the keyboard buttons in pressed state |
keyboardButtonWidthMultiplier | Object | :heavy_check_mark: | sets the amount of multiplier of the keys with the longer widths |
Contributing
All contributions including new features, requests, bug fixes are open to everyone. Feel free to open a PR!
License
React Native On-screen Keyboard is MIT licensed.