diff --git a/src/FlatListItem.js b/src/FlatListItem.js
index 1797c09..a11fe3d 100644
--- a/src/FlatListItem.js
+++ b/src/FlatListItem.js
@@ -1,46 +1,51 @@
-import React from 'react'
-import {
- View,
-} from 'react-native'
-
+import React from "react";
+import { View } from "react-native";
+import PropTypes from "prop-types";
export default class FlatListItem extends React.PureComponent {
static propTypes = {
- viewComponent: React.PropTypes.element.isRequired
+ viewComponent: PropTypes.element.isRequired
};
constructor(props) {
super(props);
this.state = {
- visibility: true,
- }
+ visibility: true
+ };
}
onLayout(evt) {
this.viewProperties = {
width: 0,
- height: 0,
- }
+ height: 0
+ };
this.viewProperties.width = evt.nativeEvent.layout.width;
this.viewProperties.height = evt.nativeEvent.layout.height;
}
setVisibility(visibility) {
if (this.state.visibility != visibility) {
- if (visibility == true) this.setState({ visibility: true })
- else this.setState({ visibility: false })
+ if (visibility == true) this.setState({ visibility: true });
+ else this.setState({ visibility: false });
}
}
render() {
if (this.state.visibility === false) {
- return ( )
+ return (
+
+ );
}
return (
{this.props.viewComponent}
- )
+ );
}
}
diff --git a/src/OptimizedFlatList.js b/src/OptimizedFlatList.js
index 8dab314..71cd3d9 100644
--- a/src/OptimizedFlatList.js
+++ b/src/OptimizedFlatList.js
@@ -1,67 +1,69 @@
-import React from 'react'
-import {
- FlatList,
-} from 'react-native'
+import React from "react";
+import { FlatList } from "react-native";
-import FlatListItem from './FlatListItem'
+import FlatListItem from "./FlatListItem";
export default class OptimizedFlatList extends React.PureComponent {
-
constructor(props) {
super(props);
- this.state = {}
- this.rowRefs =[]
+ this.state = {};
+ this.rowRefs = [];
+ }
+
+ /**
+ * Scroll to a specific content pixel offset in the list.
+ */
+ scrollToOffset(params: { animated?: ?boolean, offset: number }) {
+ this._listRef.scrollToOffset(params);
}
- _addRowRefs(ref, data){
+ _addRowRefs(ref, data) {
this.rowRefs[data.index] = {
ref: ref,
item: data.item,
- index: data.index,
- }
+ index: data.index
+ };
}
-
- _updateItem(index, visibility){
- if (!this.rowRefs[index].ref) {
+
+ _updateItem(index, visibility) {
+ if (!this.rowRefs[index].ref) {
return false;
}
- this.rowRefs[index].ref.setVisibility(visibility)
- return visibility
+ this.rowRefs[index].ref.setVisibility(visibility);
+ return visibility;
}
- _renderItem(data){
- const view = this.props.renderItem(data)
+ _renderItem(data) {
+ const view = this.props.renderItem(data);
return (
this._addRowRefs(myItem, data)}
+ ref={myItem => this._addRowRefs(myItem, data)}
viewComponent={view}
data={data}
/>
- )
+ );
}
- _onViewableItemsChanged (info: {
- changed: Array<{
- key: string,
- isViewable: boolean,
- item: any,
- index: ?number,
- section?: any,
- }>
- }
- ) {
- info.changed.map(item =>
- this._updateItem(item.index, item.isViewable)
- )
+ _onViewableItemsChanged(info: {
+ changed: Array<{
+ key: string,
+ isViewable: boolean,
+ item: any,
+ index: ?number,
+ section?: any
+ }>
+ }) {
+ info.changed.map(item => this._updateItem(item.index, item.isViewable));
}
render() {
return (
this._renderItem(data) }
+ renderItem={data => this._renderItem(data)}
onViewableItemsChanged={this._onViewableItemsChanged.bind(this)}
+ ref={ref => (this._listRef = ref)}
/>
- )
+ );
}
}