flatlist columns offset react native code example

Example 1: how to use flatlist keyextractor

<FlatList 
  data={[{name: 'a'}, {name: 'b'}]} 
  renderItem={
    ({item}) => <Text>{item.name}</Text>
  } 
  keyExtractor={(item, index) => index.toString()}
/>

Example 2: flatlist last item column 2

for your case use flex: 0.5 on the item container

therefore: Your item should have flex of 1/(number of columns) if you have 3 columns your item should have flex:1/3

///on flatlist
columnWrapperStyle={{
     flex: 1,
     justifyContent: 'space-evenly',
}

Tags:

Misc Example