title: Absolute positioning not working inside FlatList
body: <p>I am trying to create a tinder like swipe deck animation. I am using FlatList to render the images. To stack the images one above the other, I am using 'absolute' positioning. The issue with this is the images are not getting rendered and all I   am seeing is a blank screen. I am not sure whether there is something wrong with using positioning inside FlatList.</p>
  
  <p>The reason I went with FlatList is my stack will contain around 200 to 300 images. I think I can implement this without using FlatList by just rendering the images as batches (say render 10 images at once and then render the next 10 and so on).</p>
  
  <p>I want to know whether it is possible to implement this using FlatList.</p>
  
  <p><strong>NOTE: The issue is in android and I am not sure about iOS</strong></p>
  
  <pre><code>import React from "react";
  import {
    StyleSheet,
    Text,
    View,
    FlatList,
    Image,
    Dimensions,
    Animated,
    PanResponder
  } from "react-native";
  
  const DATA = [
    {
      id: 1,
      text: "Card #1",
      uri: "http://www.fluxdigital.co/wp-content/uploads/2015/04/Unsplash.jpg"
    },
    {
      id: 2,
      text: "Card #2",
      uri: "https://images.pexels.com/photos/247932/pexels-photo-247932.jpeg?h=350"
    },
    {
      id: 3,
      text: "Card #3",
      uri: "http://www.fluxdigital.co/wp-content/uploads/2015/04/Unsplash.jpg"
    }
  ];
  
  const { width, height } = Dimensions.get("window");
  
  export default class App extends React.Component {
    constructor(props) {
      super(props);
      this.position = new Animated.ValueXY();
      this.panResponder = PanResponder.create({
        onStartShouldSetPanResponder: (event, gestureState) =&gt; true,
        onPanResponderMove: (event, gestureState) =&gt; {},
        onPanResponderRelease: (event, gestureState) =&gt; {}
      });
  
      this.state = {
        currentIndex: 0
      };
    }
  
    extractKey = (item, index) =&gt; item.id.toString();
  
    renderCard = ({ item }) =&gt; {
      return (
        &lt;View style={styles.imageContainer}&gt;
          &lt;Image
            source={{ uri: item.uri }}
            resizeMode="cover"
            style={styles.image}
          /&gt;
        &lt;/View&gt;
      );
    };
  
    render() {
      return (
        &lt;FlatList
          contentContainerStle={styles.container}
          data={DATA}
          keyExtractor={this.extractKey}
          renderItem={this.renderCard}
          scrollEnabled={true}
        /&gt;
      );
    }
  }
  
  const styles = StyleSheet.create({
    container: {
      flex: 1
    },
    imageContainer: {
      width,
      height: height - 20,
      backgroundColor: "red",
      padding: 10
      position: 'absolute'
    },
    image: {
      flex: 1,
      width: null,
      height: null,
      borderRadius: 20
    }
  });
  </code></pre>