Axel Mani Axel Mani - 2 months ago 19
React JSX Question

ListView renders behind IOS keyboard - React Native

In my react-native app I've got a View that renders a TextInput and a ListView.
The ListView is populated based on what is typed in the TextInput.

<View styleComponent={styleComponent.mainContainer}>
value={this.state.text} />
renderRow={(rowData) => this._renderRow(rowData)} />

My problem is that part of the ListView is rendered behind the IOS keyboard. Is there any way, without external libraries, to tell the ListView to render in the available space, i.e. not under the keyboard.


You should use onBlur and onFocus event or keyboard events plugin and adjust your list style when keyboard opened. Take a look with this: how-to-auto-slide-the-window-out-from-behind-keyboard-when-textinput-has-focus.