Horizontal Flatlist: Space between items

I'm trying to get space around my items in a horizontal flatlist, no matter how I try it doesn't seem to work:

const renderItem = ({item}) => {return (<View style={styles.item}><Image      source={{uri: content.uri}}      style={styles.image}    /><View><Text style={styles.contentTitle}>{content.title}</Text><Text style={styles.contentText}>{content.releaseDate}</Text></View></View>)}<View style={styles.container}>  {header}<View style={{width: '100%', justifyContent: 'space-around', backgroundColor: 'green'}}><FlatList        data={data}        pagingEnabled={true}        horizontal={true}        renderItem={renderItem}        keyExtractor={item => item.id}        ref={flatList}                /></View>   </View>const styles = StyleSheet.create({  container: {    width: windowWidth,    marginTop: 15,    paddingBottom: 15,    borderBottomWidth: 1,    borderBottomColor: Colors.borderBlue,    backgroundColor: Colors.backgroundGenericTransparent,  },  item: {    width: windowWidth / 3.1,    backgroundColor: 'red',  },  image: {    width: '100%',    height: 220,  },})

result:

As you can see the items are all together on the left even though I have added a space-around property on the container. Not show how I can resolve this.