Skip to main content

GridView

<GridView
items={[{title: 'item 1', onPress: () => console.log('item 1 pressed')}, {title: 'item 2', onPress: () => console.log('item 2 pressed')}]}
numColumns={2}
lastItemLabel={'+'}
lastItemOverlayColor={'Colors.rgba(Colors.blue30)'}
/>
APIThis is the list of additional props for the component

itemSpacing
number

Spacing between each item

items
GridListItemProps[]

The list of items based on GridListItem props

keepItemSize
boolean

whether to keep the items initial size when orientation changes, in which case the apt number of columns will be calculated automatically.

lastItemLabel
string | number

overlay label for the last item

lastItemOverlayColor
string

color of overlay label for the last item

numColumns
number

Number of items to show in a row

renderCustomItem
(item: GridListItemProps) => React.ReactElement

Pass to render a custom item

viewWidth
number

pass the desired grid view width (will improve loading time)