import React, { Component } from 'react';
import { AppRegistry, ListView, StyleSheet, Text, View, TouchableOpacity  } from 'react-native';
import ScrollToTop from 'react-native-scroll-to-top'

class ScrollToTop extends Component {
  constructor() {
    super();
    const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
    this.state = {
      dataSource: ds.cloneWithRows(['row 1', 'row 2', 'row 1', 'row 2', 'row 1', 'row 2', 'row 1', 'row 2', 'row 1', 'row 2', 
      'row 1', 'row 2','row 1', 'row 2','row 1', 'row 2','row 1', 'row 2','row 1', 'row 2','row 1', 'row 2','row 1', 'row 2'
      ]),
    };
  }

  render() {
    return (
      <View>
      <ListView
        ref={(listview) => {
            this.listview = listview;
          }}
        dataSource={this.state.dataSource}
        renderRow={(rowData) => <Text style={styles.text}>{rowData}</Text>}
      />
      <ScrollToTop
          ListView
          rootView={this.listview}
      />
      </View>
    );
  }
}
const styles = StyleSheet.create({
  container: {
      padding: 10,
      marginTop: 3,
      backgroundColor: '#d9f9b1',
      alignItems: 'center',
   },
   text: {
     paddingVertical: 15,
     alignSelf: 'center',
     color: '#4f603c'
   }
})

export default ScrollToTop;