0

Im new to react-native and may be the question Im asking can be very noob. But Im not able to find any reference for it somehow.

enter image description here

There are 6 text inputs in the picture, but we can merely see 4 when keyboard appears, so how can we get 5th text input into visible area when keyboard is still there ?

Rajesh
  • 546
  • 9
  • 29

1 Answers1

1

I assume you want to scroll the input when clicked so it is visible when the keyboard is opened. There is a nice library to handle this easily.

https://github.com/APSL/react-native-keyboard-aware-scroll-view

const Screen = React.createClass({

  _scrollToInput(event) {
    this.refs.scrollview.scrollToFocusedInput(event, event.nativeEvent.target);
  },

  render() {
    return (
      <KeyboardAwareScrollView ref="scrollview">
        <View>
          <TextInput onFocus={this._scrollToInput}/>
        </View>
      </KeyboardAwareScrollView>
    );
  },
});
Janic Duplessis
  • 687
  • 7
  • 6
  • With your help I was able to find this , http://stackoverflow.com/questions/29313244/how-to-auto-slide-the-window-out-from-behind-keyboard-when-textinput-has-focus Very useful. – Rajesh Apr 26 '16 at 10:53