@coffeebeanslabs/react-native-inviewport

Detect if component is in device viewport. I based this off:https://github.com/yamill/react-native-inviewport with some slight modifications.

Install

npm i @coffeebeanslabs/react-native-inviewport

Usage

import InViewPort from "@coffeebeanslabs/react-native-inviewport";
checkVisible = isVisible => this.setState({visible: isVisible});

render() {
  return (
  <ScrollView style={{flex: 1}}>
    <InViewPort onChange={(isVisible) => this.checkVisible(isVisible)}>
      <View style={{flex: 1, height: 200, backgroundColor: 'blue'}}>
        <Text style={{color: 'white'}}>View is visible? {this.state.visible}</Text>
      </View>
    </InViewPort>
  </ScrollView>
  );
}