Home

Awesome

React Native Scrollview Smart CircleCI react-native-scrollview-smart npm version Known Vulnerabilities

A smart iOS and Android scrollview for React Native

INSTALLATION

npm i react-native-scrollview-smart --save

Android

in your `AndroidManifest.xml add:

<activity
  android:windowSoftInputMode="adjustPan" ... >

Demo

<p align="center"> <img src ="https://raw.githubusercontent.com/sarovin/react-native-scrollview-smart/master/Demo.gif" /> </p>

Usage

See the Example app

class Example extends Component {

  constructor(props) {
    super(props);
    this.scrollOnFocus = this.scrollOnFocus.bind(this);
  }

  scrollOnFocus = inputName => () => {
    this.scroll.inputFocused(
      findNodeHandle(this[inputName]),
    );
  }

  render() {
    return (
      <ScrollViewSmart
        ref={e => (this.scroll = e)}
      >
        <TextInput
          ref={e => (this.input = e)}
          onFocus={this.scrollOnFocus('input')}
        />
        // ...
      </ScrollViewSmart>
    );
  }
}

Donate