title: How do I make a list (FlatList) automatically scroll through the elements using Animated?
body: <p>I have a horizontal FlatList, where each time it reaches the end, it automatically adds new elements to the list, so it kind of is an infinite list. I want the app to scroll through the list by itself automatically, while the user must still be able to scroll back and forth. This is what I have to far</p>
  
  <pre><code>export default class ImageCarousel extends Component {
    constructor(props) {
      super(props);
  
      this.scrollX = 0;
      this.offset = new Animated.Value(0);
      this.scrollTo = this.scrollTo.bind(this);
      this.handleScroll = this.handleScroll.bind(this);
      this.stopAnimation = this.stopAnimation.bind(this);
      // Listener to call the scrollToOffset function
      this.offset.addListener(this.scrollTo);
    }
  
    _scroller() {
      toValue = this.scrollX + 10; // Scroll 10 pixels in each loop
      this.animation = Animated.timing(
        this.offset,
        {
          toValue: toValue,
          duration: 1000, // A loop takes a second
          easing: Easing.linear,
        }
      );
      this.animation.start(() =&gt; this._scroller()); //Repeats itself when done
    }
  
    scrollTo(e) {
      this.carousel.scrollToOffset({offset: e.value});
    }
  
    handleScroll(event) {
      // Save the x (horizontal) value each time a scroll occurs
      this.scrollX = event.nativeEvent.contentOffset.x;
    }
  
    componentDidMount() {
      this._scroller();
    }
    render() {
      return (
        &lt;View&gt;
          &lt;FlatList
            ref={el =&gt; this.carousel = el}
            data={someData}
            renderItem={renderFunction}
            horizontal={true}
            keyExtractor={someKeyFunction}
            onEndReached={loadMoreElementsFunction}
            onScroll={this.handleScroll}
          /&gt;
        &lt;/View&gt;
      );
    }
  }
  </code></pre>
  
  <p>It works in the sense that it is automatically scrolling through the list, the problem however, is I cannot manually scroll through the list, since the scroll position is constantly updated by the scrollTo listener. I have tried to add an onPress callback to disable the animation when the FlatList is pressed, I have however not been able to get it to work.</p>