React Native TextInput with auto height and multiline support
npm install rn-autoheight-inputReact Native TextInput with auto height and multiline support

npm or yarn:`shell
npm i rn-autoheight-input --save
``shell
yarn add rn-autoheight-input
`Usage
You can use this input wrapper together with KeyboardAwareScrollView, which can be installed from npm or yarn Import
rn-autoheight-input inside your component:`js
import InputView from 'rn-autoheight-input'
``jsx
ref={(ref) => this.scroll = ref}
contentContainerStyle={styles.container}
>
...
blurOnSubmit={false}
value={text}
onValueChange={(text) => this.setState({text})}
placeholder="Add Response"
onContentSizeChange={
(event) => {
this._scrollToInput(ReactNative.findNodeHandle(event.target));
}
}
/>
`onContentSizeChange is a callback function which is called when content size of input changes. This can be used to scroll to this input when cursur position changes.$3
`js
_scrollToInput = (reactNode: any) => {
let extraHeight = 30;
this.scroll.scrollToFocusedInput(reactNode, extraHeight);
}
`
API
$3
All the TextInput props will be passed.| Prop | Type | Description |
|----------|----------|-----------------|
|
blurOnSubmit | boolean | Set false to enable Multiline Support. Default value is true |
| value | string | Default value of input. |
| defaultHeight | number | Initial height of input. Default is 40 |
| viewStyle | Style Object | Style of Input View Wrapper. |
| inputStyle | Style Object | Style of Input. |
| onContentSizeChange | function | callback function with event argument which is called when content size of input changes. |
| onChangeText | function | callback function with text` argument which is called when value of input changes. |MIT.
Dariy D.