0.1.8 • Published 2 years ago
grid-flatlist-react-native v0.1.8
React Native Grid Flatlist
Simple Grid FlatList with two or more columns.
⭐ The last item is not stretching
⭐ Equal spacing between items
⭐ Shadow around each item is not clipped
⭐ Any Native FlatList properties are appliable
⭐ Lightweight
Demo
Installation
npm install grid-flatlist-react-native
Usage
import GridFlatList from 'grid-flatlist-react-native';
<GridFlatList
data={[1,2,3,4,5,6]}
renderItem={(item) => (<Text>{item}</Text>)}
gap={10}
paddingHorizontal={10} // Shadow around elements will not be clipped
/>
Properties
Property | Type | Default Value | Description | |
---|---|---|---|---|
data | Array | Data to be rendered. | ||
renderItem | Function | Function to render each object. | ||
numColumns | Number | 2 | Number of columns. | |
gap | Number | 12 | Spacing between each item. | |
paddingHorizontal | Number | 0 | Horizontal padding applied to whole list. | |
paddingTop | Number | 0 | Top padding applied to whole list. | |
showsVerticalScrollIndicator | Boolean | false | When true, shows a vertical scroll indicator | |
... | ... | ... | Any Native FlatList properties are appliable. |
Support
License
MIT